关于echarts使用的各种问题

此文为作者辛苦编写，如有转发，请注明出处，谢谢

首先引入js文件，这是动态引入

<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
<script src="<%=path%>/js/echarts.js"></script>

接着写js中的内容

<script type="text/javascript">
require.config({      
      paths:{            
          echarts: 'http://echarts.baidu.com/build/dist',
          }   
});
option = {
        //option中的内容是echarts官网中的每一个演示案列的option，直接copy过来就可以了
    };
//初始化数据 
$(function(){    
      echarone();     
      })        
      var echarone = function(){  
      require(      
              [      
               'echarts',  
               'echarts/chart/pie', //饼图图必须加载pie，柱张图加载bar，柱状图加载line 如果不知道需要加载什么类型。可以查看自己需要用的图标的type属性，将本例中的pie替　　　　　　　　　　　　　　　　　　　　　　换就可以了。
               ],       

　　　　　　　　function(ec) {   
                  var myChart = ec.init(document.getElementById('myChart')); 
　　　　　　　　　　　
                　　　　//异步查询option中的值可以写在此处
      　　　　　　}  
              )};
</script>

最后在body中写div层，将图生成图形嵌入

<div style="height:600px;color:white" id="myChart"></div>

整个图形就生成了。。。

关于使用时会出现的错误

echarts is not defined ，原因是

　function(ec) {   
                  var myChart = echarts.init(document.getElementById('myChart')); 
　　　　　　　　　//注意这里的echarts是从哪里来的，它就是函数传入的参数ec,直接将echarts替换为ec就可以了　　
                　　　　
      　　　　　　}  
              )};

echarts使用该引用什么类型（到底是引用pie、bar、还是line，还是其他的什么鬼。。。。）

这里教大家一个简单方法，在echarts找到你需要用的那个图表。看它的type属性。就是你需要引用的。

看图

看明白了吧

然后在js中配置

这下类型的问题就解决了

另一个问题,后续的数据怎么进去,因为在很多情况下,我们需要图表中的数据实时的变化,这时候你就会发现一个问题,

每次数据进去之后，图表都会初始化一下，也就是你看到的，图表会不见了，一会又出来了，那么如何解决这种问题呢。

请看下面：

我想出现这种问题的原因大家的初始化方式是这样的,那么到底为什么呢。

因为在这里我们每次都myChart赋予了新的值,也就是说，我们每次都要执行一下这个ec.init函数.

解决办法如下

定义一个全局变量myChart,保证无论在什么情况下只初始化一次,然后就是不停的修改option的值，就可以实现，不初始化，只改变值了

 

全局变量

ajax不停的修改option的值,全局变量myChart不断的setOption就可以了

如果还有不明白的，可以加作者QQ870510826讨论。