Echarts.js 图表在layui中的引用

  1. 下载echarts.js源码

  2. 添加部分源码,可使layui使用第三方插件的方法引入,代码如下:
//打开源码,将代码头部的代码
(function (global, factory) {
	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
	typeof define === 'function' && define.amd ? define(['exports'], factory) :
	(factory((global.echarts = {})));
}(this, (function (exports) { 'use strict';

//改为:第2个三元运算符冒号(:)后,需要添加一行代码,如下
window.layui && layui.define ? layui.define(function(exports){exports('echarts',factory(exports))}) :

//最终为:
(function (global, factory) {
	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
	typeof define === 'function' && define.amd ? define(['exports'], factory) :
    window.layui && layui.define ? layui.define(function(exports){exports('echarts',factory(exports))}) :
	(factory((global.echarts = {})));
}(this, (function (exports) { 'use strict';

//接着:在代码最尾部加:(其余的看情况加)
exports.Axis = Axis;
exports.env = env$1;
exports.parseGeoJson = parseGeoJson;
return exports;  //必加代码
})));

//最后使用:
layui.config({
      base: '../../../layuiadmin/lib/' //静态资源所在路径(使用时,根据自己的结构改动)
    }).extend({
      echarts: '/extend/echarts' //主入口模块(名字同样根据自己的结构改动)
    });
  layui.use(['form','table','echarts','util'],function(){
    var echarts = layui.echarts;
    var $ = layui.jquery;
    var table = layui.table;
    console.log(echarts);
    var myCharts = echarts.init($(dom)); // 要绘制图表的盒子dom;
    
  })

 

你可能感兴趣的:(layui,echart)