我怎样才能访问通过DOM容器的Highcharts图表

当我向div容器渲染一个highcharts图表时,如何通过div-Container访问图表对象? 我不想让图表variables全球。

var chart = new Highcharts.Chart({ chart: { renderTo: "testDivId", ... 

我想访问上面的上下文之外的图表(伪代码)来调用函数:

 var chart = Highcharts.Chart("testDivId"); //access from id chart.redraw(); 

Highcharts 3.0.1

用户可以使用highcharts插件

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

Highcharts 2.3.4

从Highcharts.charts数组中读取2.3.4版和更高版本的图表索引可以从<div>

  var index=$("#container").data('highchartsChart'); var chart=Highcharts.charts[index]; 

所有版本

通过容器ID跟踪全局对象/地图中的图表

 var window.charts={}; function foo(){ new Highcharts.Chart({...},function(chart){ window.charts[chart.options.chart.renderTo] = chart; }); } function bar(){ var chart=window.charts["containerId"]; } 

读取模式@ Highcharts提示 – 从容器ID访问图表对象

PS

自从写了这个答案以来,在较新版本的Highcharts中增加了一些内容,并且已经从@davertron,@Moes和@Przy的答案中提取出来,请大家提出他们的评论/答案,因为他们应该得到这些答案 。 在这里添加他们,因为这个被接受的答案是不完整的,

你可以这样做

 var chart = $("#testDivId").highcharts(); 

检查小提琴手的例子

 var $chartCont = $('#container').highcharts({...}), chartObj = Highcharts.charts[$chartCont.data('highchartsChart')]; 

chartCont是jQuery对象。 chartObj是Highchart图表对象。

这是使用Highcharts 3.01

我发现了另外一种方法,主要是因为我使用的是embedded在OutSystems平台中的Highcharts,而我没有办法控制图表的创build方式。

我发现的方法如下:

  1. 使用className属性为图表指定一个标识类

     chart: { className: 'LifeCycleMasterChart' } 
  2. 定义一个辅助函数,通过类名来获取图表

     function getChartReferenceByClassName(className) { var cssClassName = className; var foundChart = null; $(Highcharts.charts).each(function(i,chart){ if(chart.container.classList.contains(cssClassName)){ foundChart = chart; return; } }); return foundChart; 

    }

  3. 在需要的地方使用辅助function

     var detailChart = getChartReferenceByClassName('LifeCycleDetailChart'); 

希望它可以帮助你!

 var chart1; // globally available $(document).ready(function() { chart1 = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'bar' }, title: { text: 'Fruit Consumption' }, xAxis: { categories: ['Apples', 'Bananas', 'Oranges'] }, yAxis: { title: { text: 'Fruit eaten' } }, series: [{ name: 'Jane', data: [1, 0, 4] }, { name: 'John', data: [5, 7, 3] }] }); }); 

var chart1是全局的,所以你可以用来访问de highchart对象并不重要,这是容器

 chart1.redraw(); 

…在同事的帮助下…更好的方法是…

 getChartReferenceByClassName(className) { var foundChart = $('.' + className + '').eq(0).parent().highcharts(); return foundChart; }