Highchart插件下載與安裝

提供完整的 Highcharts 資源包，包含實例文件、全部的 js 壓縮版及源碼、導出服務器文件等。

一、資源包的使用：

 

二、開放的CDN：http://img.hcharts.cn/

 2、Highchart的安裝：

一、使用npm的安裝：

　　npm相關文檔：http://www.npmjs.com.cn/

npm install highcharts --save

• 加載  Highcharts

　　　　var Highcharts = require('highcharts'); 　　　　// 在 Highcharts 加載以後加載功能模塊 　　　　require('highcharts/modules/exporting')(Highcharts); 　　　　// 建立圖表 　　　　Highcharts.chart('container', {   　　　 /*Highcharts 配置*/ 　　　　});

• 加載 Highstock 或 Highmaps

　　　Highstock 是徹底包含 Highcharts的，因此不必將兩個文件都引用；Highmaps 能夠單獨使用也能夠經過地圖模塊來引用。

　　　var Highcharts = require('highcharts/highstock');

　　　// 加載 地圖 模塊

　　　require('highcharts/modules/map')(Highcharts);

　　　固然若是隻須要 Highmaps 功能，那麼只須要引用 highmaps.js 便可

　　 var Highcharts = require('highcharts/highmaps');

二、使用bower的安裝：

bower install highcharts --save
bower相關文檔：http://www.bowercn.com/

•  加載 Highcharts

　　<script src="/bower_components/highcharts/highcharts.js"></script>

　　<script>

　　　　// 建立圖表

　　　　Highcharts.Chart('container', {

　　　　/*Highcharts 配置*/

　　});

</script>

•  加載功能模塊

　　在 Highcharts 的基礎上增長模塊功能，只須要引入相應的模塊文件便可

　<script src="/bower_components/highcharts/modules/exporting.js"></script> 

• 加載 Highstock 或 Highmaps

　　Highstock 是徹底包含 Highcharts的，因此不必將兩個文件都引用；Highmaps 能夠單獨使用也能夠經過地圖模塊來引用。

　<script src="/bower_components/highcharts/highstock.js"></script> 　<script src="/bower_components/highcharts/modules/map.js"></script> 

　　固然若是隻須要 Highmaps 功能，那麼只須要引用 highmaps.js 便可

　<script src="/bower_components/highcharts/highmaps.js"></script>