0

再会。我的数据看起来像这样

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 轴显示的顺序很奇怪。我该如何解决？是否可以删除奇怪的“序数”参数？

看起来不错，但 y 轴有问题

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

没有序数的奇怪

错误是

react-dom.development.js:1297 Error: attribute d: Expected number, "MNaN,740.47619047…&quot;.
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".
4

1 回答 1

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

将解决这个升序问题

考虑preparedData是一个对象数组 [{x: "06/22/21 01:31:00", y: "11.091"},....]

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

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

并且要删除序数，您应该删除和

于 2020-08-28T13:27:40.330 回答