0

这个问题可能很愚蠢，我道歉。我正在使用 $.each 循环遍历 JSON 中的不同对象，并且对于每个对象，我使用以下代码使用 Highcharts 构建图表：

var chart = new Highcharts.Chart({
            chart: {
                renderTo: ('chart' + index),
                type: 'line',
                backgroundColor:'rgba(255, 255, 255, 0.0)', // Transparent BG
                width:190,
                height: 80,
                events:{ 
                    click: function(e){
                        drawChart('area',index);
                    }
                }
            },
            plotOptions: {
                line: {
                    marker: { enabled: false }
                }
            },
            xAxis: {
                categories: xAxis,
                labels: { enabled:false },
                lineWidth:0,
                tickWidth: 0,
                lineColor: '#FFFFFF'
            },
            yAxis: {
                title: { text: null }, // Set the text to null to disable the label
                labels: { enabled: false },
                gridLineWidth: 0
            },  
            series: [{
                data: yAxis,
                color: '#FFF'
            }]
        });

正如你所看到的，我已经指定了一个“点击”事件，因为我需要激活对 plotArea 的点击。点击应该调用另一个在指定中绘制图表的函数，但它不起作用:(这是 drawChart() 函数。

function drawChart(ctype,index){

    var chartWidth = $("#container").width() - 50;
    var chart1 = new Highcharts.Chart({
        chart: {
            renderTo: (ctype + 'Chart'),
            backgroundColor:'rgba(255, 255, 255, 0.0)', // Transparent BG
            width: chartWidth,
            height:400,
            type: ctype
        },
        plotOptions: {
            line: {
                marker: { enabled: false }
            },
            series: {
                shadow: { color: '#CCC' },
                stickyTracking: false
            }
        },
        xAxis: {
            categories: itemsX[index]
        },  
        series: [{
            data: itemsY[index],
            type: ctype,
            color: '#CCCCCC'
        }]
    });
} // Close drawChart()

有人可以帮我理解为什么吗？谢谢！

4

2 回答 2

1
  1. renderTo: (ctype + 'Chart'), 看起来很糟糕（大多数情况下，它应该是标记中id的容器标签）。<div>
  2. 你确定itemsX[index]anditemsY[index]是数组并且非空吗？
  3. 放弃有什么type: ctype,用series: [{data: itemsY[index],type: ctype,color: '#CCCCCC'}]？

编辑：根据我的理解可能会看到这个副本

于 2013-06-25T06:31:00.390 回答
0

我认为问题在于javascript中的闭包。您正在使用循环创建图表，因此事件未正确绑定，请在此处阅读更多信息

也有可能的解决方案，或者尝试使用这样的东西：

$.each(array, function(index, element) { 
  (function(element) { //element or index
     var chart = ... //create chart 

  })(element)
});
于 2013-06-25T09:52:39.680 回答