1、yarn add ngx-echarts
2走触、yarn add echarts
3、import {NgxEchartsModule} from 'ngx-echarts';
4、 <div echarts [options]="option" style="height: 160px;"></div>
5蚌吸、模板一

import {graphic} from 'echarts';
option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        label: {
          backgroundColor: '#000'
        }
      }
    },
    lineStyle: {
      width: 1,
      type: 'solid',
      color: '#63ACFF'
    },
    grid: {
      left: '3%',
      right: '4%',
      bottom: '3%',
      top: '8%',
      containLabel: true
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: false,
        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
      }
    ],
    yAxis: [
      {
        type: 'value'
      }
    ],
    series: [
      {
        name: '維修工作',
        type: 'line',
        stack: '總量',
        areaStyle: {},
        data: [120, 132, 101, 134, 90, 230, 210]
      },

    ],
    color: new graphic.LinearGradient(
      0, 0, 0, 1,
      [
        {offset: 0, color: '#9BC9FF'},
        {offset: 0.7, color: '#EFF6FF'},
        {offset: 1, color: '#EFF6FF'}
      ]
    )
  };

6、模板二

 option = {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    grid: {
      top: '1%',
      left: '2%',
      right: '7%',
      bottom: '3%',
      containLabel: true
    },
    xAxis: {
      type: 'value',
      boundaryGap: [0, 0.01]
    },
    yAxis: {
      type: 'category',
      data: ['實(shí)際故障', '統(tǒng)計(jì)故障', '風(fēng)險(xiǎn)等級(jí)']
    },
    series: [
      {
        name: '2011年',
        type: 'bar',
        data: [1049, 1317, 3302],
        itemStyle: {
          emphasis: {
            barBorderRadius: [0, 6, 6, 0]
          },

          normal: {
            barBorderRadius: [0, 6, 6, 0]
          }
        }
      },
      {
        name: '2012年',
        type: 'bar',
        data: [1215, 1341, 3818],
        itemStyle: {
          emphasis: {
            barBorderRadius: [0, 6, 6, 0]
          },

          normal: {
            barBorderRadius: [0, 6, 6, 0]
          }
        }
      }
    ],
    color: ['#268AFF', '#50E3C2']
  };