Не удается передать дату на линейный график nivo - PullRequest
Новая
       13

Не удается передать дату на линейный график nivo

0 голосов
/ 24 апреля 2020

Я использую линейный график nivo и хочу использовать ось X в качестве временной шкалы, вплоть до минуты. К сожалению, я не могу отобразить этот график, потому что он не может правильно прочитать дату. Например, это часть моих данных: 

{ x: "2020-04-24T13:07:44.000+0000", y: 0.8063946735624102 }

это данные, которые получает диаграмма, сгенерированные с помощью следующего кода: 

let cpuEntry = {
             x: data[i].created,
             y: data[i].system_cpu
         };

Когда я пытаюсь открыть диаграмму, я получаю это сообщение об ошибке: 

Uncaught TypeError: v.getTime is not a function

После небольшого исследования, которое я обнаружил, диаграмме нужен объект Date. Я обернул его так: 

x: new Date(data[i].created),

, который дает мне такой результат: 

Fri Apr 24 2020 15:07:44 GMT+0200

и эта ошибка: 

Uncaught Error: Objects are not valid as a React child (found: Fri Apr 24 2020 15:25:00 GMT+0200). If you meant to render a collection of children, use an array instead.

Это часть моего Конфигурация в ResponsiveLine: 

                    xScale={{
                    format: 'native',
                    type: 'time'
                }}

Я прочитал кое-что о попытке использовать "toString ()", но это просто круг тех же ошибок. Я надеюсь, что кто-то может мне помочь. При необходимости я предоставлю дополнительную информацию.

1 Ответ

0 голосов
/ 24 апреля 2020

Вы должны указать формат xScale как 

xScale={{ format: "%Y-%m-%dT%H:%M:%S.%L%Z", type: "time" }}

И xFormat (в качестве примера) 

xFormat="time:%Y-%m-%dT%H:%M:%S.%L%Z"

Или (если хотите только время) 

xFormat="time:%H:%M:%S.%L"

Вот полный рабочий пример: https://codesandbox.io/s/react-hooks-counter-demo-dbr34?file= / src / index. js

А форматы времени см. https://github.com/d3/d3-time-format

...