react-vis使y轴按升序排序

Question

日安。我的数据如下所示

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"}

和我的react-vis组件代码

<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>

这看起来很好，但y轴显示的顺序非常奇怪。我怎么才能修复它？是否有可能删除奇怪的“序号”参数？

​

​

如果没有所有轴的序数，它看起来就像…这对我来说是非常奇怪的行为，我期待着更可预测的绘画。为什么它不在x上画一些文本，在y上画一些点？我不知道。

​

​

错误是

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');

将解决这个升序问题

假设preparedData是一个对象数组{x："06/22/21 01:31:00"，y："11.091"}，....

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

然后将preparedData传递给数据并在发送之前进行排序

对于删除序号，您应该删除和