【问题标题】:Highchart graph not plotting - CSVHighchart 图表未绘制 - CSV
【发布时间】:2013-03-11 10:10:27
【问题描述】:

目前无法将数据显示在高图表上。

我正在从 CSV 文件导入数据,并绘制这些数据。 CSV 文件采用以下格式:

"Row1","Row2","Row3"
"1362567600","67882833572","63034526585"
"1362571200","67834631584","63250345463"
"1362574800","67886235392","63654664341"
"1362578400","67883347248","63683239219"
"1362582000","67884373456","63905665096"

CSV 文件中的每一行有 44 个元素。

我目前正在通过以下方式导入它:

$(document).ready(function() { 
    var c = [];
    var d = [];
    var e = [];

    $.get('test.csv', function(data) {
        var lines = data.split('\n');
        $.each(lines, function(lineNo, line) {
            var items = line.split(',');
            c.push(items[0]);
            d.push(items[1]);
            e.push(items[2]);
        });
        createGraph('container', 'line', 'Graph 1', c[0],d[0],c);
    });

});

函数 createGraph 接受参数 - divId(指定要在哪个 div 中显示图形;graphType、graphTitle、line1、line2 和 graphCategories。

我创建了一个数组 - seriesData[] 并使用以下 for 循环向其中添加数据:

seriesData[0] = "[";
for (var i = 1; i < graphCategories.length - 1; i++){
    seriesData[i] = "["+(graphCategories[i].replace(/["']{1}/gi,"")*1000)+","+876+"],";
}
seriesData.push("],");

在控制台上记录这个数组时,它看起来像这样:

[,[1362567600000,876],,[1362571200000,876],,[1362574800000,876],,[1362578400000,876],,],

然后在绘制我使用的图表时:

series: [{
            name: line1,        
            data: seriesData
        }]

(还有另一行,但为简单起见,我只展示这一行)。

我的问题是,为什么图表上没有显示任何内容?我得到以下输出:

Highchart Example

感谢您的帮助。

【问题讨论】:

    标签: javascript jquery arrays csv highcharts


    【解决方案1】:

    这条线看起来不对。

    seriesData[0] = "[";
    seriesData.push("],");
    

    我认为您不需要将 [ 或 ] 添加到数组中。

    我会更喜欢这样:

    for (var i = 1; i < graphCategories.length - 1; i++){
        // Push the x value.
        seriesData[i].push(graphCategories[i].replace(/["']{1}/gi,"")*1000);
        // Push the y value.
        seriesData[i].push(876);
    }
    

    【讨论】:

    • 推送有问题。显然对象为空或未定义;我已经使用var seriesData = []; 进一步设置了 seriesData
    • 好的,我现在有了绘图点,但是没有任何线条。
    • 解决了!非常感谢史蒂夫。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-05-15
    • 2013-01-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-01-26
    • 1970-01-01
    相关资源
    最近更新 更多