与csv的Highchart多个系列

时间:2014-01-16 08:22:03

标签: highcharts

我想创建一个类似此页面的图表:http://www.sjc.com.vn/chart/mini2.php 这是我的ata.csv

2013-10-12 09:10;37.100;37.300
2013-10-11 16:01;37.250;37.350
2013-10-11 14:35;37.200;37.350
2013-10-11 11:08;37.150;37.350
2013-10-11 09:36;37.130;37.330
2013-10-11 09:18;37.150;37.350
2013-10-11 09:05;37.150;37.350
2013-10-10 17:30;37.340;37.410
2013-10-10 16:52;37.350;37.420
2013-10-10 16:32;37.360;37.430
2013-10-10 15:51;37.370;37.440
2013-10-10 14:34;37.380;37.450
2013-10-10 12:23;37.360;37.430
2013-10-10 11:48;37.360;37.430
2013-10-10 11:14;37.340;37.440
2013-10-10 09:53;37.330;37.430
2013-10-10 09:07;37.330;37.430
2013-10-09 17:12;37.400;37.500
2013-10-09 10:17;37.430;37.530
2013-10-09 09:04;37.450;37.550
2013-10-08 11:31;37.450;37.550
2013-10-08 09:47;37.450;37.550
2013-10-08 09:33;37.450;37.580
2013-10-08 09:06;37.450;37.600
2013-10-08 09:05;37.400;37.600
2013-10-07 15:22;37.400;37.500
2013-10-07 10:40;37.370;37.520
2013-10-07 09:16;37.400;37.550
2013-10-07 09:05;37.400;37.550
2013-10-05 09:13;37.300;37.500
2013-10-04 17:08;37.350;37.500

以下是我想用高图做的事情: http://jsfiddle.net/trantienit/s2axe/1/

$(function() {
var seriesOptions = [],
    yAxisOptions = [],
    seriesCounter = 0,
    names = ['AAPL', 'GOOG'],
    colors = Highcharts.getOptions().colors;

$.each(names, function(i, name) {

    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename='+ name.toLowerCase() +'-c.json&callback=?',   function(data) {

        seriesOptions[i] = {
            name: name,
            data: data
        };

        // As we're loading the data asynchronously, we don't know what order it will arrive. So
        // we keep a counter and create the chart when all the data is loaded.
        seriesCounter++;

        if (seriesCounter == names.length) {
            createChart();
        }
    });
});



// create the chart when all data is loaded
function createChart() {

    $('#container').highcharts('StockChart', {
        rangeSelector: {
            selected:2
        },


        tooltip: {
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
            valueDecimals: 2
        },

        series: seriesOptions
    });
}

});

如何将它们合并在一起?

1 个答案:

答案 0 :(得分:1)

如果您有CSV,则无法使用JSON或getJSON函数。你需要使用$ .get()然后解析你的csv以正确的系列结构。应将更多日期拆分并转换为时间戳(即Date.UTC())格式。

相关主题:http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-file-csv-xml-json