资讯详情

使用 AMD 或 CommonJS 模块安装 Highcharts|官方文档使用

📅 2026/10/7 16:12:30 | 华诺云谱 👁 阅读
使用 AMD 或 CommonJS 模块安装 Highcharts|官方文档使用
使用 AMD 模块安装HighchartsHighcharts 兼容 AMD 模块加载器如 RequireJS。以下示例演示了如何使用 RequireJS 从 CDN 加载 Highcharts 及两个模块。htmlhead!-- 请先在项目中提供 RequireJS 文件 --scriptsrcrequire.js/scriptscriptrequire.config({packages:[{name:highcharts,main:highcharts}],paths:{highcharts:https://code.highcharts.com}});/script/headbodydividcontainer/divscriptrequire([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 模块安装 HighchartsHighcharts 使用的是统一模块定义UMD模式因此它支持 CommonJS——这是 Node.js 所使用的模块系统。以下示例假设你是通过 npm 安装 Highcharts更多详情请参见 使用 npm 安装 。// Load HighchartsvarHighchartsrequire(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});
📝

华诺云谱内容团队

资深建站顾问 · 行业研究员

10年+企业数字化服务经验,专注智能建站、SEO优化与品牌营销,持续输出建站技巧、行业洞察与营销干货,已帮助5000+企业实现数字化增长。

你可能需要的服务

订阅华诺云谱资讯周报

每周一封,精选建站技巧、SEO与营销干货,直达邮箱。已有 8,000+ 企业主订阅,助你少走弯路。

↑