React-vis сделать ось Y для сортировки в порядке возрастания - PullRequest
Новая
       96

React-vis сделать ось Y для сортировки в порядке возрастания

0 голосов
/ 13 июля 2020

добрый день. мои данные выглядят так: 

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

И мой код для компонента response-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 отображает очень странный порядок. Как я могу это исправить? И можно ли удалить странный 'порядковый' параметр?

looks good but y-axis is out of order

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.

странно без порядкового номера

Ошибки 

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

1 Ответ

0 голосов
/ 28 августа 2020 
import _ from 'lodash';  
object = _.sortBy(object, 'key');

решит эту проблему в порядке возрастания

рассмотрите, что подготовленные данные - это массив объектов [{x: «22.06.21 01:31:00», y: «11.091»} ,. ...] 

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

затем передайте подготовленные данные в данные и выполните сортировку перед отправкой

, а для удаления порядковых номеров вы должны удалить и

...