C3.js

Question

influxDB 时间戳如下所示：

2015-01-29T21:55:43.702900257Z

问题是当我使用 C3.js

生成图形时，我应该为 x-axis 使用什么选项

我得到的错误：

"Failed to parse x '2015-01-29T21:55:43.702900257Z' to Date object"

也许这个 jsfiddle 可以帮助您进行一些快速测试...我认为问题出在时间格式上，但欢迎提出任何其他建议：

axis: {
    x: {
        type: 'timeseries',
        tick: {
            format: '%Y-%m-%d'
        }
    }
}

Answer 1

首先，我必须添加 xFormat 因为 @das Keks says :

"The format in the axis Object just defines how the date will be displayed. If you want to specify the format for the date parsing you have to use xFormat in the data object."

data: {
    x: 'x',
    xFormat: '%Y-%m-%dT%H:%M:%S.%LZ',
    columns: [
        ['x', ... ],
        ['data1', ... ]
    ]
}

对于 xFormat options 参见 D3.js / Time Formatting

其次，为了获得正确的格式，我更改了每个时间戳，首先使用 Date() 创建日期对象，然后使用 dateObj.toISOString()。例如，打开您的控制台并试试这个：

> new Date('2015-09-30T12:21:41.447494312Z').toISOString();
> "2015-09-30T12:21:41.447Z"

C3.js - 在绘制取自 InfluxDB 的时间序列时如何指定时间戳格式

C3.js - How to specify the timestamp format when plotting timeseries taken from InfluxDB

format

timestamp

time-series

influxdb