Echarts 配置 使用心得

菜鸟记录：

查看大神Echarts 心得，成功实现了项目中数据图表。

echarts 配置如下：

<script src="http://echarts.baidu.com/build/dist/echarts.js"></script> <script type="text/javascript">     require.config({          paths:{             echarts:'http://echarts.baidu.com/build/dist'         }     });     require(         [             'echarts',             'echarts/chart/line'          ],         function(ec){               var barChart8 = ec.init(document.getElementById("main8"));               option8 = {                   。                   。                   。 };             barChart8.setOption(option8,true);              window.onresize = barChart8.resize;         }   ); </script>

 

但是由于项目部署到内网导致数据报表无法显示。

 

原因： 内网无法获取  http://echarts.baidu.com/build/dist    echarts.js包

然后我就下载echarts.js包,导入到发现 还是无法显示。

<script src="<%=path%>/js/echarts/js/echarts.js"></script>

 

本地配置需要注意:

 

注意1：

发现 大神们 Echarts心得中 还导入了（由于少导入这个包，十分的纠结。。）

<script src="<%=path%>/js/echarts/com/esl.js"></script>

esl.js 架包 ：ESL是一个浏览器端、符合AMD的标准加载器，适合用于现代Web浏览器端应用的入口与模块管理。

 

注意2：

require.config  paths 路径

            'echarts':'<%=path%>/js/echarts/js/echarts',       √

            'echarts':'<%=path%>/js/echarts/js/echarts.js',    X

的结尾 最后  echarts 就可以  ，  无需写 echarts.js 。

 

 

最后的 本地   echarts  成功配置 

 

导入echarts.js包 <script src="<%=path%>/js/echarts/js/echarts.js"></script> 导入esl.js包  <script src="<%=path%>/js/echarts/com/esl.js"></script>    <script type="text/javascript" >     require.config({          paths:{             'echarts':'<%=path%>/js/echarts/js/echarts',                    'echarts/chart/pie':'<%=path%>/js/echarts/js/echarts',             'echarts/chart/bar':'<%=path%>/js/echarts/js/echarts',             'echarts/chart/line':'<%=path%>/js/echarts/js/echarts'         }     }); 。 。 。 实现图表对象 与上类似