2013-06-28 27 views
7

ウェブサイトがあり、ハイチャートを1ページ追加できました。ハイチャートエラー#16:同じページにチャートが表示されない

同じページを別のaspページに正確にコピーしましたが、最初のグラフは消えて2番目のグラフは表示されません。

私にエラーを与えている:

Uncaught Highcharts error #16: www.highcharts.com/errors/16 highcharts.js:16 
Uncaught SyntaxError: Unexpected token ILLEGAL Dashboard.aspx:657 
Uncaught TypeError: Object [object Object] has no method 'highcharts' Dashboard.aspx:405 
Uncaught TypeError: Object [object Object] has no method 'draggable' 

任意のアイデアは、なぜこれを取得しています。

ので、新しいチャートの私のコードは私がしたい:

<script type="text/javascript" 
$(function() { 
$('#container').highcharts({ 
    chart: { 
     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] 
    }] 
}); 
});​ 
></script> 

次のコードを持って取り組んでいるチャート:

<script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script> 



    <script type="text/javascript"> 

    $(function() { 

     $('#container').highcharts({ 
      chart: { 
       type: 'column' 
      }, 
      title: { 
       text: 'Chart' 
      }, 
      xAxis: { 
      categories: array1 
      }, 
      yAxis: { 
       title: { 
        text: 'aWH' 
       } 
      }, 
      tooltip: { 
       pointFormat: "Value: {point.y:.1f} mm" 
      }, 

      series: [{ 

       name: '2011-2012', 
       color: '#0000FF', 
       data: array 
      }, 
      { 

       name: '2012-2013', 
       color: '#92D050', 
       data: array3 
      }, 


      { 

       color: '#FF0000', 
       name: '2013-2014', 
       data: array2 
}] 
     }); 

    }); 

</script> 

第二のチャート番組を。

が、最初のチャートdoesntの、

両方のコードでは、切り抜いたacsxページにあります!

答えて

21

そう、

このエラーは、第二の時間Highchartsを起こるかHighstockが同じページにロードされているGiven Error Link

Highchartsエラー#にすでにページで定義された16

Highchartsを行けばHighcharts名前空間は既に定義されています。 Highcharts.ChartコンストラクタとHighchartのすべての機能はHighstockに含まれているので、ChartとStockChartを組み合わせて実行している場合は、highstock.jsファイルをロードするだけで済みます。

チェックあなたがhighchartsのために二度目のスクリプトライブラリをコピーしたかどうか、あなたのコードは一度だけ含まれている必要があります

<script src="http://code.highcharts.com/highcharts.js"></script> 

を編集

あなたはここで$('#container')コンテナと同じdiv要素でグラフを表示しようとしていますdivのIDです。両方のascxがページ内でレンダリングされると、Idコンテナで同じdivを見つけて、その1つをオーバーライドするグラフをレンダリングします。 ASCXから(次)

<div id="container1" style="min-width: 400px; height: 400px; margin: 0 auto"></div> 
<div id="container2" style="min-width: 400px; height: 400px; margin: 0 auto"></div> 
  • 削除スクリプトとマスターページにそれを置く:そう

    1. は、2つの別々のdivを作成します。:チャート二つの場合

      $('#container1').highcharts({//other code 
      

      :あなたはHighcharts.jsライブラリを実行するコードをラップするためにこの方法を使用することができます

      $('#container2').highcharts({//other code 
      
  • +0

    yh、これは一度だけ...だから、これはどういう意味ですか –

    +0

    エラーがまだ発生していますか?あなたのコードを投稿する。 –

    +0

    私は自分のコードをアップロードしました –

    1

    チャートいずれかの

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script> 
    
  • 。 :

    if (!window.HighchartsUniqueName) { 
        window.HighchartsUniqueName = true; 
    
        // .. your code which runs Highcharts.js library here ... 
    
    } 
    

    私はそれをここに見つけましたhttps://stackoverflow.com/a/5154971それは私のために働く。

    In this way you don't need to put your script in the MasterPage if you don't want.

    それはグローバル変数なので、非常にユニークなの名前を使用してください。

    Highcharts.ChartコンストラクタとHighchartsのすべての機能がHighstockに含まれているので、ChartとStockChartを組み合わせて実行する場合は、highstock.jsファイルをロードするか、ラップする必要があります同じやり方で。

  • 関連する問題