web-dev-qa-db-ja.com

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

javascripthtmlhighchartshighstockhandlebars.js
12
Marion

同じエラーに直面しましたが、HighCharts.jsがDOMに存在しない要素にアクセスしようとすると、Error＃13が発生することを知りました。

どのように修正しましたか？ DOMでターゲット要素が作成された後にのみ、HightChartsメソッドが呼び出されるようにしました。ビンゴ！！！！すべてがうまくいきました。

11
Jay

私は同じ問題を抱えていて、正しいコンテナーを使用してそれを修正しました：

私の場合、私は以下を使用しました：

// 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=1561

よろしく。

6
Gabriela Vaca Guzman G.

パーティーに少し遅れるかもしれませんが、Highchartsの例でのコンテナーのデフォルト名は「コンテナー」でした。ブラウザはそれが好きではないようでした、おそらく名前の衝突、 'Chart'への変更がトリックをしました。

1
Michael Couck

カテゴリーはコレクションである必要があります、それはこのようでした：

categories: xaxis

これを次のように変更します。

categories: ['xaxis']

一部のデータフィールドは、次のように一重引用符で囲む必要があります。

data: 'blue'

エラーのないフィドルは次のとおりです。

http://jsfiddle.net/MVcBe/

残りの幸運を祈ります。 :)

psハイチャートサイトから作業中のフィドルを編集して、必要に応じて調整する方が簡単な場合があります。このように：

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/

1
hutchonoid

私にとって、HTML要素の後にscriptを呼び出すとエラーが解決しました。

お気に入り;

<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/1

1
Aamir Shahzad

私も同じエラーコードに遭遇しましたが、私の場合、理由は私のデータが大きすぎてサポートできないためでした

0
huang botao

また、「highcharts-more.js」がHTMLで宣言されていることを確認してください。

<script src="https://code.highcharts.com/highcharts-more.js"></script>
0
lecorbu

ドキュメント準備機能の後にスクリプトコードをロードしましたが、正常に機能しました。

$(document).ready(function(){
});
0
G.Ashok Kumar