javascript redraw - Как я могу получить доступ к диаграмме Highcharts через DOM-Container




4 Answers

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];

Все версии

Отслеживать графики в глобальном объекте / карте по идентификатору контейнера

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 Tips - Доступ к объекту диаграммы из идентификатора контейнера

PS

Некоторые дополнения были сделаны в новых версиях Highcharts с момента написания ответа и были взяты из ответов @davertron, @Moes и @Przy, пожалуйста, повысьте их комментарии / ответы, поскольку они заслуживают признания за них. Добавление их здесь, поскольку этот принятый ответ был бы неполным без этих

get data

Когда я выношу диаграмму highcharts в контейнер div, как я могу получить доступ к объекту диаграммы через div-Container? Я не хочу, чтобы переменная диаграммы была глобальной.

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

Я хочу получить доступ к диаграмме вне контекста выше, как это (псевдокод), для вызова функций:

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



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

chartCont - объект jQuery. chartObj - объект диаграммы Highchart.

Это использование Highcharts 3.01




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]
         }]
      });
   });

Диаграмма var1 является глобальной, поэтому вы можете использовать ее для доступа к высокому объекту, который не имеет значения, который является контейнером

chart1.redraw();



Просто с чистым JS:

var obj=document.getElementById('#container')
Highcharts.charts[obj.getAttribute('data-highcharts-chart')];




Related

javascript jquery html dom highcharts