echarts引用的简单步骤

首先导入echarts的包   <script src = "js/echarts.min.js"></script>

<style>
   .box{                  
   300px;
   height:300px;
   background:lightgreen;
   }
</style>
 <body >
 <div class="box"></div>      //设置一个div用来做放置图表的容器。
<script>
//1.echarts初始化。
var myChart = echarts.init(document.querySelector(".box"));
//2.设置图表配置项
var option = {
   xAxis: {
          type: 'category',                                                         //该部分可从echarts官网来获得option内的代码。
          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
      },
      yAxis: {
          type: 'value'
      },
      series: [{
          data: [120, 200, 150, 80, 70, 110, 130],
          type: 'bar',
          showBackground: true,
          backgroundStyle: {
              color: 'rgba(220, 220, 220, 0.8)'
          }
      }]
};
myChart.setOption(option);         //配置
</script>
 </body>

原文地址:https://www.cnblogs.com/yangqqq/p/13353318.html