web-dev-qa-db-ja.com

HighchartとHighmapを一緒に使用する場合の競合を解決します(TypeError:maは関数ではありません)

レポート機能のチャートとマップメニューを含むページがあります。次に、上記の目的を達成するためにHighchart-Highmapライブラリを選択します。チャート関数は正常に動作しますが、マップ関数を開発するとエラーが表示されます

TypeError:maは関数ではありません

  • Ma関数がhighchart.jsとhighmaps.jsに表示されるという問題を追跡しましたが、この競合を解決する方法がわかりません。
  • ハイマップにjQuery.noConflict();を入れようとしましたが、それでも競合が発生します

これは私がメインページでコーディングする方法です

... some html code
<script type="text/javascript" src="././js/highcharts/highcharts.js"></script>
<script type="text/javascript" src="././js/highcharts/highcharts-more.js"></script>
<script type="text/javascript" src="././js/highcharts/highcharts-3d.js"></script>            
<script type="text/javascript" src="././js/highcharts/modules/drilldown.js"></script>
<script type="text/javascript" src="././js/highcharts/modules/exporting.js"></script>

... some html code
<script type="text/javascript" src="././js/Highmaps/highmaps.js"></script>
<script type="text/javascript" src="././js/Highmaps/modules/data.js"></script>                
<script type="text/javascript" src="././js/Highmaps/modules/exporting.js"></script> 

この問題を解決するにはどうすればよいですか?

14
m hanif

Highmapsの代わりに、map.jsモジュールを使用する必要があります。

<script src="//code.highcharts.com/maps/modules/map.js"></script>

これは両方を一緒に使用するためのドキュメントです

40

highcharts.jsの後にこのスクリプトタグを含める必要があります。

<script src="https://code.highcharts.com/maps/modules/map.js"></script> 
5
gfivehost

同じ問題が発生し、マップの後にハイチャートを配置することで解決しました

<script src="http://code.highcharts.com/maps/highmaps.js"></script>
<script src="http://code.highcharts.com/maps/modules/data.js"></script>
<script src="http://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="http://code.highcharts.com/mapdata/custom/world.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>

http://jsfiddle.net/danny_shumer/tc898kgv/2/

1
Danny Shumer