码迷,mamicode.com
首页 > Web开发 > 详细

Echarts - js

时间:2016-06-11 22:46:20      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:

<script type="text/javascript">
        var myChart;
  myChart = echarts.init(document.getElementById(‘main‘));
  
  
  var legendDate="";
var series="";
var ser="";
var legend="";
var option={};
 $.ajax({
      type: "post",
      async: false, //同步执行
      url: "task/result_charts",
      dataType: "json", //返回数据形式为json
      success: function (result) {
          legendDate = ["2014","2015","2016"];
          series =  [ { "name":"2014", "type":"bar", "data":[51, 2, 43],"len":"中国"} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4] ,"len":"美国"},{ "name":"2016", "type":"bar", "data":[5, 20, 40],"len":"英国"}];
          legend = ["中国","美国","德国"];
             optionSeries();
             for(i=0;series.length>i;i++){
             option.series[i]=series[i];
             }
      },
      error: function (errorMsg) {
      }
  });
  
  
 function optionSeries(){
 
  option = {
    title: {
        text: ‘性能数据采集入库效率趋势图‘
    },
    tooltip: {
        trigger: ‘axis‘,
        axisPointer: {
            type: ‘shadow‘
        }
    },
    legend: {
        data: legendDate
    }, 
    grid: {
        left: ‘3%‘,
        right: ‘4%‘,
        bottom: ‘3%‘,
        containLabel: true
    },
    xAxis: {
        type: ‘value‘,
        boundaryGap: [0, 0.01]
    },
    yAxis: {
        type: ‘category‘,
        data: legend
    },
    series: [ ]
};
 }
 

 //通过Ajax获取数据
 

  myChart.setOption(option);
    </script>

 

Echarts - js

标签:

原文地址:http://www.cnblogs.com/onetwo/p/5576036.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!