Contents

<div id="main" style="height: 400px;"></div>
<script type="application/javascript" src="/report/js/echarts.min.js"></script>
<script type="text/javascript">
  var myChart = echarts.init(document.getElementById('main'));
  var option = {
    tooltip : {
      trigger: 'axis',
      axisPointer : {            // 坐标轴指示器，坐标轴触发有效
        type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
      }
    },
    toolbox: {
      show : true,
      feature : {
        mark : {show: true},
        dataView : {show: true, readOnly: false},
        magicType: {show: true, type: ['line', 'bar']},
        restore : {show: true},
        saveAsImage : {show: true}
      }
    },
    calculable : true,
    legend: {
      data: []
    },
    grid: {
      left: '3%',
      right: '4%',
      bottom: '3%',
      containLabel: true
    },
    xAxis: [
      {
        type : 'category',
        data : []
      }
    ],
    yAxis: [
      {
        type : 'value'
      }
    ],
    series : []
  }

  var result = <%= raw @data[:charts].to_json %>;
  for(var i=0; i<result.length; i++){
    option.legend.data.push(result[i].series_name);
    var data = result[i].data;
    var series = {
      name: result[i].series_name,
      type: "bar",  //"line"
      label: {
        normal: {
          show: true,
          position: 'top'
        }
      },
      data: [],
      markLine: {data: [{type: 'average', name: '平均值'}]}
    }
    for(var j=0; j<data.length; j++){
      option.xAxis[0].data.push(data[j].category_name);
      series.data.push(data[j].value);
    }
    option.series.push(series);
  }

  myChart.setOption(option);

  function eConsole(param) {
    console.log(param);
  }

  myChart.on("click", eConsole);
</script>

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
treport-0.2.0	app/views/templates/public_two.html.erb
treport-0.1.0	app/views/templates/public_two.html.erb