我如何解决Highcharts错误＃13？ [英] How can I fix Highcharts error #13?

问题描述

我使用highchart，用户可以关闭并打开图表页面并重新绘制图表，在某些情况下给我这个错误，我该如何解决它，谢谢
这里是我的代码

$ pre $函数populateGraph（graph1data1， （'＃'+ id）.highcharts（{
图：{
类型：'line'
}，
xAxis：{
tickWidth：0，
categories：['1,2,3,4']
}，
yAxis：{
gridLineColor：'#fff'，
title：{
text：''
}，
labels：{
formatter：function（）{
return'';
}
}
} ，
navigation：{
buttonOptions：{
enabled：false
}
}，
series：[{
name：'This' ，
数据：[1,2 ，3,4]，
color：'＃1e71ef'
}，{
name：'Last'，
data：[5,6,7,8]，
color：'＃dfe0e1'
}]
}）;
}）;





$ b函数loadOnlineDashboardChannel（频道）{
$ .ajax（{
type ：get，
dataType：'html'，
data：{}，
url：/ companies / 2 / online_dashboard_channel，
success：function（data，status ）{
var obj = JSON.parse（data）;
var template_data = {
measures_list：
obj.measures
};
$（函数（）{
var tmplHTML_measures ='{{#measures_list}}< div class =col-lg-11 col-lg-offset-1>< p class =indicator-title gray-bottom < div>< p>< div>< p>< div class =font30px> {{total}}< / span& > {{increase}}％< / span>来自< / span>< / p>< / div>< div class =graph-header>< h3> {{this_interva新的{{name}}< / p>< p class =percentage-graph green-text> {{percentag e}}％< p>< p>< ; / div>< div id = {{graph_id}} class =graph>< / div> < / DIV> {{/ measures_list}};
Handlebars.render = function（tmpl，data）{data = data || {}; return Handlebars.compile（tmpl）（data）;};
$（＃template）。empty（）。append（Handlebars.render（tmplHTML_measures，template_data））;
var data_graph;
for（var i = 0; i< obj.measures.length; i ++）{
data_graph = obj.measures [i];
populateGraph（data_graph.this_interval_detail，data_graph.last_interval_detail，data_graph.graph_id，time，obj.bottom_graph_text，parseInt（$（'＃timeframe-select'）。find（：selected）。attr（'interval'） ））;
}
}）


}，
错误：函数（错误）{

}
} ）;

返回这个;
};

我在这部分使用了句柄

在
var tmplHTML_measures
我创建了div，在我调用函数来绘制图表。

谢谢，我有时重复它的作品完美，有时会失败给我错误＃13

解决方案

我遇到了同样的错误，我知道错误＃13 HighCharts.js尝试访问DOM中不存在的元素。

我如何修复它？
我确保只有在DOM中创建了我的目标元素后才调用HightCharts方法。答对了！！！！一切正常。

I use highchart so, the user can close and open the chart page and redraw the chart, in some case give me this error, how can I fix it, Thanks Here is my code

 function populateGraph(graph1data1,graph1data2,id,time,bottomText,tickinterval){
$(function () {
  $('#'+id).highcharts({
      chart: {
          type: 'line'
      },
      xAxis: {
        tickWidth: 0,
        categories: ['1,2,3,4']
      },
      yAxis: {
        gridLineColor: '#fff',
          title: {
              text: ''
          },
          labels: {
              formatter: function() {
                  return '';
              }
          }              
      },
      navigation: {
        buttonOptions: {
            enabled: false
        }
    },
      series: [{
          name: 'This ',
          data: [1,2,3,4],
          color: '#1e71ef'     
      }, {
          name: 'Last ',
          data: [5,6,7,8],
          color:'#dfe0e1'
      }]
  });
});
}
}




       function loadOnlineDashboardChannel(channel){
          $.ajax({
          type: "get",
          dataType: 'html',
          data: {},
          url: "/companies/2/online_dashboard_channel",
          success: function(data, status){ 
          var obj = JSON.parse(data);
          var template_data = { 
            measures_list:   
              obj.measures         
          };
          $(function() { 
        var tmplHTML_measures = '{{#measures_list}} <div class="col-lg-11  col-lg-offset-1"><p class="indicator-title gray-bottom-border">{{name}}</br></p><div><p><span class="font30px">{{total}} </span> Total {{name}}<br><span class="green-text">{{increase}}%</span> from last <span class="metric_time"></span></p></div><div class="graph-header"><h3>{{this_interval}} </h3><p>New {{name}}</p><p class="percentage-graph green-text">{{percentag e}}%<p></div><div id={{graph_id}} class="graph"></div> </div>{{/measures_list}}';   
          Handlebars.render = function(tmpl, data){data = data || {};return                                                       Handlebars.compile(tmpl)(data);};  
      $("#template").empty().append(Handlebars.render(tmplHTML_measures,template_data) );
      var data_graph;
      for ( var i = 0; i < obj.measures.length; i++ ) {
        data_graph=obj.measures[i];
                      populateGraph(data_graph.this_interval_detail,data_graph.last_interval_detail,data_graph.graph_id,time,obj.bottom_graph_text,parseInt($('#timeframe-select').find(":selected").attr('interval')) );
      }              
     })


  },
  error: function(error) {

}
});

return this;
};

I use handlebar so in this part in var tmplHTML_measures I create the div, in the for I call the function to draw the chart.

Thanks, I repeat sometimes it works perfectly and sometimes fail give me the error #13

解决方案

I faced the same error and what I got to know is that Error#13 occurs when HighCharts.js tries to access an element which is not present in the DOM.

How I fixed it? I made sure that the HightCharts method is called only after my targeted element is created in the DOM. Bingo!!!! Everything worked fine.

这篇关于我如何解决Highcharts错误＃13？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！