Question

我在ID为container的div中渲染Highcharts图表，如下所示：

new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        type: 'line',
        zoomType: 'x'
    },

    xAxis: {
        categories: ['Jan', 'Feb']
    },

    series: [{
        data: [29.9, 71.5]
    }]
});

<div id="container" class="chart"></div>

请注意，我还没有在变量中捕获对图表对象的引用。在图表渲染后的某个时刻，可以从已渲染到的元素的ID中获取对图表对象的引用（在这种情况下为container）？

Answer 1

使用jQuery

var Mychart=$("#container").data('highchartsChart');

或

var Mychart=$("#container").highcharts();

jsfiddle

或通过Highcharts＆＃39;图表数组（如果您的图表是第一个，则为[0]）

var Mychart = Highcharts.charts[0];

Answer 2

您可以通过Highcharts对象访问它。使用Highcharts创建的每张图表都将被推入Highcharts＆＃39; charts数组。如果这是您创建的第一个图表，您可以像这样获得对它的引用：

var chart = Highcharts.charts[0];

您的元素本身将包含对其dataset属性中上述数组的索引的引用。同样，如果这是您创建的第一张图表，您会看到如下内容：

document.getElementById('container').dataset;

> DOMStringMap { highchartsChart: "0" }

此highchartsChart属性包含相关的数组索引，您可以使用该索引确保选择了正确的图表：

var index = document.getElementById('container').dataset.highchartsChart,
    chart = Highcharts.charts[index];

获取Highcharts图表的参考

2 个答案: