将多个系列从json文件添加到highcharts

时间:2012-03-19 10:37:07

标签: json highcharts

请帮忙, 我只知道关于highcharts,Json和Jquery的5天。我有一个Json文件,其中包含3组结果的信息。我试图在高图表图表上放置3条不同的线条。我不知道这个的语法。我知道调用选项对象允许您添加系列和类别。我不知道完成此任务的语法 这是迄今为止的代码:

        var chart;
        var eng_data;
        var data;
        var options, series;

        $(document).ready(function () {
            options = {
                chart: {
                    renderTo: 'container',
                    zoomType: 'x',
                    spacingRight: 20
                    //  events: { load: requestData }
                },
                title: {
                    text: null

                },

                subtitle: {
                    text: document.ontouchstart === undefined ?
            'Click and drag in the plot area to zoom in' :
            'Drag your finger over the plot to zoom in'
                },

                xAxis: {
                    type: 'datetime',
                    maxZoom: 7 * 24 * 3600000, // 7 days
                    title: {
                        text: null
                    }
                },

                yAxis: {
                    title: {
                        text: 'Percentages'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },

                tooltip: {
                    shared: true
                },

                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                plotOptions: {
                    area: {
                        fillColor: {
                            linearGradient: [0, 0, 0, 300],
                            stops: [
                    [0, Highcharts.getOptions().colors[0]],
                    [1, 'rgba(2,0,0,0)']
                ]
                        },
                        lineWidth: 1,
                        marker: {
                            enabled: false,
                            states: {
                                hover: {
                                    enabled: true,
                                    radius: 2
                                }
                            }
                        },
                        shadow: false,
                        states: {
                            hover: {
                                lineWidth: 1
                            }
                        }
                    }
                },

                series: []

            };
    });


    $.getJSON('eng.txt', function (eng_data) {
        for (var i = 0; i < eng_data.length; i++) {
            series = {
                data: []
            };
            if (i == 1 && i <= 4) {
                //     options.addSeries({
                data: eng_data[i];
                name: "English";
                pointInterval: 72 * 3600 * 1000;
                pointStart: Date.UTC(2012, 0, 01)

                //     });
            }
            if (i == 5 && i <= 8) {
                //     options.addSeries({
                data: eng_data[i];
                name: "Maths";
                pointInterval: 72 * 3600 * 1000;
                pointStart: Date.UTC(2012, 0, 02)
                //    });
            }

            if (i == 9 && i <= 12) {
                //    options.addSeries({
                data: eng_data[i];
                name: "Science";
                pointInterval: 72 * 3600 * 1000;
                pointStart: Date.UTC(2012, 0, 03)
                //   });
            }
            options.series.push(series);
            var chart = new Highcharts.Chart(options);
        }
    });

0 个答案:

没有答案