zoukankan      html  css  js  c++  java
  • ECharts

    这里所使用的版本是

    version = '2.2.0';
    dependencies = { zrender: '2.0.7' };


    1、下载ECharts源码,如果不知道哪下载,百度一下ECharts,然后就能看到官网了。

    2、下载后,可以看到build文件夹,如果不是为了调测,可以直接使用dist文件夹下的。echarts.js和echarts-all.js区别在于后者已经把map.js打包进去了。如果网站上不用map,应该使用echarts.js,这样因为文件小能减少加载时间。

    3、把build下的文件拷贝到你想要放的工程目录中,我拷贝进来后把dist改成了echarts

    4、头部引入

        <script type="text/javascript" src="../common/echarts/echarts.js"> </script>  

    5、然后就可以在script中使用

        require.config({  
                    paths: {  
                        //echarts: 'http://echarts.baidu.com/build/dist'  百度在线地址  
                        echarts:'../common/echarts/'  
                    }  
                });  


    6、定义一个div

        <div id="mydiv" style="1000px;height:600px;"></div>  

    7、比如画折线加柱状图

    require(  
            [  
                'echarts',  
                'echarts/chart/line',  
                'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载  
            ],  
          function(ec) {//ec是包含echarts的对象,但不是echarts实例, comment by danielinbiti  
            var myChart = ec.init(document.getElementById('mydiv'));  
            myChart.setOption(option);//option似乎参数,可以参见官网的各个实例设置方式  
          }  
        )


    到这里,一个配置的例子就算完事了,各种图形方式都一样。里面的参数设置要想做好了还是挺复杂的,很灵活。下回讲解ec.init方法和setOption方法分析源码过程。

  • 相关阅读:
    leetcode 268. Missing Number
    DBSCAN
    python二维数组初始化
    leetcode 661. Image Smoother
    leetcode 599. Minimum Index Sum of Two Lists
    Python中的sort() key含义
    leetcode 447. Number of Boomerangs
    leetcode 697. Degree of an Array
    滴滴快车奖励政策,高峰奖励,翻倍奖励,按成交率,指派单数分级(1月3日)
    北京Uber优步司机奖励政策(1月2日)
  • 原文地址:https://www.cnblogs.com/Lv2017/p/7144056.html
Copyright © 2011-2022 走看看