javascript - C3-折线图时间序列错误: x is not defined for id = "Dates"

标签 javascript d3.js charts c3.js

我正在尝试将时间序列作为 x 轴添加到 C3 中的两线图。不幸的是,我不知道该怎么做。它给出了错误“x is not defined for id = "Dates"”,尽管我已尝试尽可能地遵循 C3 的时间序列图表示例。

这是代码,有什么想法吗?

request.addEventListener('readystatechange', function () {
        if (this.readyState == 4) {
            var throughputReceived = JSON.parse(this.responseText).throughputReceived,
                throughputSent = JSON.parse(this.responseText).throughputSent,
                date = JSON.parse(this.responseText).date,
                chart,
                length = throughputReceived.length;

            for (var i = 0; i < length; i++) {
                throughputReceived[i] /= 1000000;
                throughputSent[i] /= 1000000;
                //                date[i] = moment(date[i]).format("YYYY MM DD hh ss");
            }

            throughputReceived.unshift('Throughput Received (Mbps)');
            throughputSent.unshift('Throughput Sent (Mbps)');
            date.unshift('Dates');

            chart = c3.generate({
                bindto: container,
                data: {
                    x: date,
                    columns: [date, throughputReceived, throughputSent]
                },
                axis: {
                    x: {
                        //                        label: 'Test No.'
                        type: 'timeseries',
                        tick: {
                            format: '%Y %m %d %h %s'
                        }
                    },
                    y: {
                        label: {
                            text: 'Throughput (Mbps)',
                            position: 'outer-top'
                        },
                        tick: {
                            format: d3.format('.2f')
                        }
                    }
                }
            });
        }
    });

最佳答案

您定义的 x 轴错误。

您必须定义列的标题,而不是引用您的日期数组。

date.unshift('Awesome-Column');
...
data: {
        x: 'Awesome-Column',
        columns: [date, throughputReceived, throughputSent]
       },

关于javascript - C3-折线图时间序列错误: x is not defined for id = "Dates",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41782843/

相关文章:

javascript - 如何在 nvd3 简单折线图中默认禁用某些流?

javascript - 在用 d3.js 制作的 map 上显示图标/图像而不是圆圈/路径

c# - 如何遍历 ChartColorPalette 属性并添加到列表?

javascript - NodeJS http 和非常大的响应体

php - 在 Magento 中从表单元素 ID 中删除冒号

javascript - 为什么 IIFE 和常规函数在创建只读变量时表现不同?

asp.net - 在 ASP.net 中插入 Javascript

javascript - 同时使用 "d3.event.preventDefault"和 "d3.event.which"

java - 根据 ArrayList 中存储的数据制作 CandleStick 图表动画

javascript - 如何在Highchart的Piechart中做Drilldown?