require.js加载highcharts.js/exporting.js实现图表的绘制和图片文件功能的导出

简介: require.js加载highcharts.js/exporting.js实现图表的绘制和图片文件功能的导出

第一步:在require.js的做数据文件中(data-main)对应的文件中进行require.config配置,代码如下:


require.config({
    paths: {
        'highcharts': '../libs/highcharts/Highcharts-6.1.2/code/highcharts',
        'exporting': '../libs/highcharts/Highcharts-6.1.2/code/modules/exporting'
    },
});


第二步:在对应的页面的js文件中进行初始化以及绘图,代码如下:


 //初始化模块,*这一步很重要*
 Exporting(Highcharts);
  //设置highcharts属性值
 Highcharts.setOptions({
  //你的配置
     });
 //绘制饼图
 $('#alert-pie').highcharts({
 //你的绘图选项
     });            
相关文章
|
2月前
|
JavaScript 前端开发 内存技术
js文件的入口代码及需要入口代码的原因
js文件的入口代码及需要入口代码的原因
43 0
|
28天前
|
缓存 前端开发 JavaScript
JavaScript加载优化
JavaScript加载优化
|
28天前
|
缓存 前端开发 JavaScript
优化CSS和JavaScript加载
优化CSS和JavaScript加载
|
1月前
|
缓存 前端开发 JavaScript
优化CSS和JavaScript加载
Next.js和Nuxt.js在优化CSS和JavaScript加载方面提供了多种策略和工具。Next.js通过代码拆分、图片优化和特定的CSS/JavaScript优化措施提升性能;Nuxt.js则通过代码分割、懒加载、预渲染静态页面、Webpack配置和服务端缓存来实现优化。两者均能有效提高应用性能。
|
2月前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
179 0
|
26天前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
25 1
JavaScript中的原型 保姆级文章一文搞懂
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
102 2
|
22天前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
17 0
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
142 4
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
85 4