echarts 报表使用

下载echats后,将下包中的js引入项目,
\echarts-2.2.7\echarts-2.2.7\build\dist

//在页面中建立宽高的区域,用来显示报表

<div style="height: 500px;">
  <div id="cmain" style="height:339px;width: 100%;"></div>
  </div>

需要在jsp中引入echarts.js

<script src="/echarts/asset/js/echarts.js"></script>
1 //报表
         require.config({
             paths : {
                 echarts : '${basePath}/echarts/asset/js'   //指向echarts所需js所在包的路径
             }
         });
         require([ 'echarts', 'echarts/chart/line', // 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表,此处引入了line折线图,bar柱状图
         'echarts/chart/bar' ], function(ec) {
             var myChart = ec.init(document.getElementById('cmain'));      //初始化报表
             var option = {
                 title : {
                     text : '图表名称',
                     subtext : ''
                 },
                 tooltip : {
                     trigger : 'axis'
                 },
                 legend : {
                     data : [ '1人数', '2人数' ]
                 },
                 toolbox : {
                     show : true,
                     feature : {
                         mark : {
                             show : false
                         },
                         dataView : {
                             show : true,
                             readOnly : false
                         },
                         magicType : {
                             show : true,
                             type : [ 'line', 'bar' ]
                         },
                         restore : {
                             show : true
                         },
                         saveAsImage : {
                             show : true
                         }
                     }
                 },
                 calculable : true,
                 xAxis : [ {
                     type : 'category',
                     boundaryGap : false,
                     data :[2015-08-11,2015-08-12,2015-08-13,2015-08-14]
                 } ],
                 yAxis : [ {
                     type : 'value',
                     axisLabel : {
                         formatter : '{value}'
                     }
                 } ],
                 series : [ {
                     name : '1人数',
                     type : 'line',
                     data :[1,2,3,5]
                 },{
                     name:'2人数',
                     type:'line',
                     data:[2,3,5,5]
                 }]
             };                        

             myChart.setOption(option);
             myChart.setTheme('macarons');       //设置样式主题
         });