首页 > 代码库 > Echarts入门

Echarts入门

一、包的引入

  1.引入jQuery对应的js

   <script type="text/javascript" src="http://www.mamicode.com//js/jquery-3.1.1.min.js"></script>

  2.引入Echarts对应的js

    <script src="http://www.mamicode.com/echarts-m-1.0.0/source/echarts.js"></script>

二、Echarts初始化与简单应用

    <script type="text/javascript">
      require.config( {
        paths : {
              echarts : ‘echarts-m-1.0.0/dist‘
        }
    });

     require(
        [ ‘echarts‘,
          ‘echarts/chart/pie‘, // 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
          ‘echarts/chart/funnel‘,
          ‘echarts/chart/bar‘
         ],
          function(ec) {
            var myCharts = ec.init(document.getElementById(‘myCharts‘));
            // OPTION - BEGIN

       ...

       // OPTION - END
            myCharts.setOption(option);
    });

    // 其中id="myCharts"为body正文中对应div的id

    //如下,需设置div的宽度和高度

    <body>
            <div id="myCharts" style="height:400px;width:800px"></div>
       </body>

 

Echarts入门