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

Question

InfluxDB时间戳看起来像这样:

• 2015-01-29T21:55:43.702900257Z

问题是x-axis当我使用C3.js生成图形时,我应该使用哪些选项

我得到的错误:

"无法将x'2015-01-29T21:55:43.702900257Z'解析为Date对象"

也许这个jsfiddle会帮助你做一些快速测试...我认为问题在于时间格式,但欢迎任何其他建议:

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

Answer 1

首先,我必须补充,xFormat因为@das Keks 在这里说:

"轴Object中的格式只定义了日期的显示方式.如果要指定日期解析的格式,则必须在数据对象中使用xFormat."

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

有关xFormat options详见D3.js/时间格式

其次,为了获得正确的格式,我首先通过创建Date对象Date()然后使用来更改每个时间戳dateObj.toISOString().例如,打开控制台并尝试以下操作:

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