C3.js 中的时间序列图无法访问时间戳

Timestamp not accessed for Time series plot in C3.js

本文关键字:访问 时间戳 时间序列 js C3      更新时间:2023-09-26

我正在尝试为给定数据绘制具有两列的时间序列图,第一列具有时间戳,第二列是当时各自的电压值。通过 C3.js url 方法访问数据文件,并指定日期时间的解析格式。输出不显示。我不知道,但是,我在这里尝试的方式是对的吗?请帮帮我。

这是我的 C3 脚本:

        var chart=c3.generate({
               data: {
                   url: '/data/data.csv'
                   x: 'timestamp'
                   xFormat: '%m/%d/%Y %H:%M:%S %p' 
//                 My date format in .csv file is: 9/30/2015  6:38:00 PM
                   columns: [
                        ['timestamp', ... ],
                        ['voltage', ... ]
                    ]
               },
               axis: {
                    x: {
                        type: 'timeseries',
                        tick: {
                            format: function(x) {
                                retun x.getDate();
                            }
                        }
                    }
               }
            });

经过一些实验,我修改了您的代码,添加了分隔参数所需的逗号 (,),然后我让您的代码片段正常工作。以下是修订后的代码:

var chart=c3.generate({
   data: {
       url: 'data/data.csv',
       x: 'timestamp',
       xFormat: '%m/%d/%Y %H:%M:%S %p',
        //~ My date format in .csv file is: 3/2/2016 6:44:00 PM
       columns: [
            ['timestamp'],
            ['voltage']
        ]
    },
    axis: {
        x: {
                type: 'timeseries',
                tick: {format: function (x) { return x.getHours(); }}
            }
        }
});

在"tick"参数中,我相信您需要使用JavaScript日期时间方法,例如"getHours()",因为您正在尝试格式化该行中的日期,而不是获取新日期。在我的情况下,输出以 0 到 24 小时为增量。

另外,我的数据.csv文件如下所示:

 timestamp,voltage
 3/2/2016 6:44:00 PM,30.893
 3/2/2016 4:57:00 PM,75.964
 3/2/2016 3:43:00 PM,96.37
 3/2/2016 2:38:00 PM,99.157
 3/2/2016 1:29:00 PM,85.335
 3/2/2016 11:16:00 AM,31.445