2

我试图在一页中添加多个条形图，但是当它们显示时，只有最后一个被正确显示。在其他之前的图表中，未绘制条形图

每个图表我都有这 2 个变量（GraphOptionsX 和 GraphSeriesX）。

var GraphOptions0 = {
    chart:{renderTo: null,type: 'bar',height: 200,width: 300},
    title:{text:null},
    subtitle:{text:null},
    xAxis:{
        categories:null
    },
    yAxis:{min:0,title:{text: null},labels:{overflow: 'justify'}},
    tooltip:{formatter:function(){return '' + this.x + ' = ' + this.y;}},
    plotOptions:{bar:{dataLabels:{enabled: true}}},
    legend:{enabled: false},
    credits:{enabled: false},
    exporting:{enabled: false},
    series:[]
};
var GraphSeries0 = {
        name:"",
        data:[],
        point:{events:{click: null}}
};

在我生成图表之后（x = 0, 1,...）：

var graphSeries = eval("GraphSeries" + x);

        graphSeries.name = "GraphSeries" + x;
        graphSeries.data.push({ y: parseInt(107),   color: 'red' });
        graphSeries.data.push({ y: parseInt(31),    color: 'blue' });
        graphSeries.data.push({ y: parseInt(635),   color: 'green' });
        graphSeries.data.push({ y: parseInt(203),   color: 'yellow' });
        graphSeries.data.push({ y: parseInt(2),     color: 'orange' });
        graphSeries.point.events.click = function() {
            alert ('Category: '+ this.category +', value: '+ this.y);
        }

        var graphOptions = eval("GraphOptions" + x);
        graphOptions.xAxis.categories = ['Category 1', 'Category 2', 'Category 3', 'Category 4', 'Category 5'];
        graphOptions.chart.renderTo = 'containerChart'+x;
        graphOptions.series.push(graphSeries);

        new Highcharts.Chart(graphOptions);
4

1 回答 1

0

无法理解您的问题是什么，而是一个根据您的数据创建三个图表的演示：在每个循环中，您只需要清除数据数组和系列数组。

for(x = 0; x < 3; x++)
    {
    var graphSeries = eval("GraphSeries");
        graphSeries.data = [];

    graphSeries.name = "GraphSeries" + x;
    graphSeries.data.push({ y: parseInt(107 + x),   color: 'red' });
    graphSeries.data.push({ y: parseInt(31),    color: 'blue' });
    graphSeries.data.push({ y: parseInt(635),   color: 'green' });
    graphSeries.data.push({ y: parseInt(203),   color: 'yellow' });
    graphSeries.data.push({ y: parseInt(2),     color: 'orange' });
    graphSeries.point.events.click = function() {
        alert ('Category: '+ this.category +', value: '+ this.y);
    }

    var graphOptions = eval("GraphOptions");
        graphOptions.series = [];
    graphOptions.xAxis.categories = ['Category 1', 'Category 2', 'Category 3', 'Category 4', 'Category 5'];
    graphOptions.chart.renderTo = 'containerChart'+x;
    graphOptions.series.push(graphSeries);

    new Highcharts.Chart(graphOptions);
    }

这是一个演示：http: //jsfiddle.net/De8MB/1/

于 2013-01-31T22:20:55.317 回答