企业官网建设流程全解析

使用 AMD 模块安装Highcharts

Highcharts 兼容 AMD 模块加载器（如 RequireJS）。以下示例演示了如何使用 RequireJS 从 CDN 加载 Highcharts 及两个模块。

<html><head><!-- 请先在项目中提供 RequireJS 文件 --><scriptsrc="require.js"></script><script>require.config({packages:[{name:'highcharts',main:'highcharts'}],paths:{highcharts:'https://code.highcharts.com'}});</script></head><body><divid="container"></div><script>require(['highcharts','highcharts/modules/exporting','highcharts/modules/accessibility'],function(Highcharts){Highcharts.chart('container',{title:{text:'RequireJS 加载的 Highcharts'},series:[{type:'line',data:[1,2,3,4,5]}]});});</script></body></html>

观看 jsFiddle在线.

使用 AMD 模块时，Highcharts 还允许在 同一页面中混合使用多个版本 。

CommonJS 模块安装 Highcharts

Highcharts 使用的是统一模块定义（UMD）模式，因此它支持 CommonJS——这是 Node.js 所使用的模块系统。

以下示例假设你是通过 npm 安装 Highcharts，更多详情请参见 使用 npm 安装 。

// Load HighchartsvarHighcharts=require('highcharts');// Alternatively, this is how to load Highstock. Highmaps and Highcharts Gantt are similar.// var Highcharts = require('highcharts/highstock');// Load the exporting modulerequire('highcharts/modules/exporting');// Generate the chartHighcharts.chart('container',{// options - see https://api.highcharts.com/highcharts});