react-vis make y-axis to sort in ascending order

Question

good day. my data looks like this

0: {x: "06/22/21 01:31:00", y: "11.091"}
1: {x: "06/22/21 01:34:00", y: "10.863"}
2: {x: "06/22/21 01:36:00", y: "11.085"}
3: {x: "06/22/21 01:37:00", y: "11.216"}
4: {x: "06/22/21 01:39:00", y: "11.138"}
5: {x: "06/23/21 04:51:00", y: "75.535"}
6: {x: "06/23/21 04:52:00", y: "70.967"}
7: {x: "06/23/21 04:52:00", y: "9.225"}
8: {x: "06/23/21 04:53:00", y: "61.032"}
9: {x: "06/23/21 04:53:00", y: "2.069"}
10: {x: "06/23/21 04:53:00", y: "63.261"}

And my code for react-vis component

<XYPlot width={1200} height={700} margin={{left: 100}}
                xType='ordinal' yType='ordinal'>
            <VerticalGridLines/>
            <HorizontalGridLines/>
            <XAxis/>
            <YAxis/>
            <LineMarkSeries
                className="linemark-series"
                style={{
                    strokeWidth: '3px'
                }}
                lineStyle={{stroke: 'red'}}
                markStyle={{stroke: 'blue'}}
                data={preparedData}
            />
        </XYPlot>

It seems fine BUT y axis display very strange order. How can I fix it? And is it possible to remove strange 'ordinal' param?

Without ordinal for all axis it looks like that... And this is very weird behavior to me I expected more predictable drawing. Why it doesn't draw some text on x and some points on y? I don't know.

Errors are

react-dom.development.js:1297 Error: attribute d: Expected number, "MNaN,740.47619047…".
setValueForProperty @ react-dom.development.js:1297
index.js:1 Warning: Received NaN for the cx attribute. If this is expected, cast the value to a string.
in circle (created by MarkSeries)
in g (created by MarkSeries)
in MarkSeries (created by LineMarkSeries)
in g (created by LineMarkSeries)
in LineMarkSeries (at AnalyticsChartsAverage.js:45)
in svg (created by XYPlot)
in div (created by XYPlot)
in XYPlot (at AnalyticsChartsAverage.js:39)
in div (at AnalyticsChartsAverage.js:38)
in AnalyticsChartsAverage (at AnalyticsButton.js:17)
in div (at AnalyticsButton.js:16)
in div (at AnalyticsButton.js:14)
in div (at AnalyticsButton.js:12)
in AnalyticsButton (created by Context.Consumer)
in Route (at PathRouter.js:23)
in Switch (at PathRouter.js:15)
in PathRouter (at App.js:41)
in div (at App.js:40)
in div (at App.js:38)
in div (created by LoadingOverlayWrapper)
in LoadingOverlayWrapper (at App.js:26)
in div (at App.js:25)
in App (at src/index.js:32)
in Provider (at src/index.js:31)
in Router (created by BrowserRouter)
in BrowserRouter (at src/index.js:30)
console. @ index.js:1
11Error: attribute cx: Expected length, "NaN".

Answer 1

import _ from 'lodash';  
object = _.sortBy(object, 'key');

will solve this ascending order issue

consider preparedData is an array of objects [{x: "06/22/21 01:31:00", y: "11.091"},....]

preparedData = _.sortBy(preparedData, 'y');

then pass preparedData to data and sort before you send

and for removing ordinals you should remove and