С3.JS-Timeseries со временем не удается проанализировать

Я хочу, чтобы отобразить диаграмму временных рядов с C3.js использование даты в формате 2015-09-17 18:20:34 и строка формата '%Y-%m-%d %H:%M:%S' но он не смог разобрать.

мой код:

var chart = c3.generate({
    bindto: '#chart',
    data: {
      x: 'times',
      columns: [
        ['times','2015-09-17 18:20:34','2015-09-17 18:25:42','2015-09-17 18:30:48'],
        ['data','1539','1546','1546','1550']
      ]
    },
    axis: {
        x: {
            type: 'timeseries',
            tick: {
                format: '%Y-%m-%d %H:%M:%S'
            }
        }
    }
});

и я получаю следующую ошибку:

02:26:44.889 Failed to parse x '2015-09-17 18:20:34' to Date object c3.min.js:1:21943
02:26:44.889 Failed to parse x '2015-09-17 18:25:42' to Date object c3.min.js:1:21943
02:26:44.890 Failed to parse x '2015-09-17 18:30:48' to Date object c3.min.js:1:21943
02:26:44.890 Failed to parse x '2015-09-17 18:20:34' to Date object c3.min.js:1:21943
02:26:44.891 Failed to parse x '2015-09-17 18:25:42' to Date object c3.min.js:1:21943
02:26:44.892 Failed to parse x '2015-09-17 18:30:48' to Date object c3.min.js:1:21943

это работает, если я опускаю время в данных и в формате, но мне тоже нужно время.

11
c3.js javascript parsing time-series

2 ответов

Я нашел решение своей проблемы:

формат axis объект предназначен только для определения того, как будет отображаться дата. Если вы хотите указать формат для анализа даты, вы должны использовать xFormat на data "объект".

var chart = c3.generate({
    bindto: '#chart',
    data: {
      x: 'times',
      xFormat: '%Y-%m-%d %H:%M:%S', // how the date is parsed
      columns: [
        ['times','2015-09-17 18:20:34','2015-09-17 18:25:42','2015-09-17 18:30:48'],
        ['data','1539','1546','1546','1550']
      ]
    },
    axis: {
        x: {
            type: 'timeseries',
            tick: {
                format: '%Y-%m-%d %H:%M:%S' // how the date is displayed
            }
        }
    }
});
25

существует также другой способ передачи даты в массивы C3 timeseries. Вы можете преобразовать строки даты в объект даты Javascript перед подачей его на c3.

var chart = c3.generate({
    bindto: '#chart',
    data: {
      x: 'times',
      xFormat: '%Y-%m-%d %H:%M:%S', // how the date is parsed
      columns: [
        ['times',new Date('2015-09-17 18:20:34'),new Date('2015-09-17 18:25:42'),new Date('2015-09-17 18:30:48')],
        ['data','1539','1546','1546','1550']
      ]
    },
    axis: {
        x: {
            type: 'timeseries',
            tick: {
                format: '%Y-%m-%d %H:%M:%S' // how the date is displayed
            }
        }
    }
});

Если у вас возникли трудности с преобразованием строк даты в объекты даты (например. 2016-01-01T00:00:00Z ), вы также можете использовать momentjs для анализа вашего datestring.

var momentjsobject = moment('2016-05-06T00:00:00Z');
var dateObject = new Date(momentjsobject.format('YYYY-MM-DD HH:mm:ss'));
2