简单入门echart方法

图表用echart， 然后前端的 HTML 跟 nodejs  , nodejs 去调用 后端PHP的接口

 

链接：https://www.jianshu.com/p/1f2c37c5c02f

官网：https://echarts.apache.org/examples/zh/index.html#chart-type-pie

 

1.引入echart库

import * as echarts from 'echarts';

2.初始化echart，找到div的id

 var myChart = echarts.init(document.getElementById('main'));

3.设置option

 var option = {
      title: {
        text: 'ECharts 入门示例'
      },
      tooltip: {},
      legend: {
        data:['销量']
      },
      xAxis: {
        data: ['衬衫','羊毛衫','雪纺衫','裤子','高跟鞋','袜子']
      },
      yAxis: {},
      series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
      }]

4.将option设置到mychart里面

myChart.setOption(option);

5.渲染插件需要放的地方

 <div id="main" style={{width: '600px', height:'400px'}}></div>