Как я могу исправить ошибку Highcharts # 13?
Я использую highchart, поэтому пользователь может закрыть и открыть страницу диаграммы и перерисовать диаграмму, в некоторых случаях дать мне эту ошибку, как я могу ее исправить, спасибо
Вот мой код
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;
};
Я использую ручку, поэтому в этой части
в var tmplHTML_measures
Я создаю div, потому что я вызываю функцию для рисования диаграммы.
Спасибо, я иногда повторяю, что он отлично работает и иногда не дает мне ошибку # 13
Ответы
Ответ 1
Я столкнулся с такой же ошибкой, и я узнал, что ошибка № 13 возникает, когда HighCharts.js пытается получить доступ к элементу, который отсутствует в DOM.
Как я его исправил?
Я убедился, что метод HightCharts вызывается только после того, как мой целевой элемент создается в DOM. Бинго!!!! Все работало нормально.
Ответ 2
У меня была та же проблема, и я исправил ее, используя правильный контейнер:
В моем случае я использовал следующее:
// Use Meteor.defer() to create chart after DOM is ready:
Meteor.defer(function() {
// Create standard Highcharts chart with options:
Highcharts.chart('Charts', {
chart: {
renderTo: 'container',
type: 'column',
options3d: {
enabled: true,
alpha: 15,
beta: 15,
depth: 50,
viewDistance: 25
}
},....
}.....
}
Template.body.helpers({
createChart: function () {...}
и в файле HTML:
<div id='Charts'>
{{createChart}}
</div>
Я нашел исправление в Highcharts: http://forum.highcharts.com/viewtopic.php?f=9&t=15610
С уважением.
Ответ 3
Категории должны быть коллекциями, это было так:
categories: xaxis
Измените его так:
categories: ['xaxis']
Некоторые поля данных должны быть заключены в одинарные кавычки следующим образом:
data: 'blue'
Вот скрипка без ошибок для вас:
http://jsfiddle.net/MVcBe/
Удачи с остальными.:)
ps Мне иногда легче редактировать рабочую скрипку с сайта highcharts и адаптировать ее к тому, что вам нужно. Как этот:
http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/
Ответ 4
Также убедитесь, что в вашем HTML объявлен "highcharts-more.js".
<script src="https://code.highcharts.com/highcharts-more.js"></script>
Ответ 5
Для меня ошибка была решена, когда я поместил вызывающий script
после HTML-элемента.
Подобно;
<div id="container"></div>
<script>
Highcharts.chart('container', {
// some script here
});
</script>
Также, если вы проверяете на сайте с высоким графиком, он говорит:
This error occurs if the chart.renderTo option is misconfigured so that
Highcharts is unable to find the HTML element to render the chart in.
https://www.highcharts.com/errors/13
Ответ 6
Я загрузил коды скриптов после функции готовности документа, и она работала нормально.
$(document).ready(function(){
});
Ответ 7
Возможно, немного опоздал на вечеринку, но именем по умолчанию для контейнера в примере Highcharts было "контейнер". Похоже, браузеру это не понравилось, возможно, коллизия имен, смена на "Chart" сделала свое дело.
Ответ 8
Я также сталкиваюсь с тем же кодом ошибки, но в моем случае причина была в том, что мои данные были слишком большими для поддержки