1.把下载的echarts.js下载下来引入,封装公共函数

/**
     *
     * @param domElement	// 获取的dom
     * @param  Array xAxisData	// x轴值
     * @param  Array seriesData	// Y轴值
     * @param   legendData	//  //legend的data: 用于设置图例，data内的字符串数组需要与sereis数组内每一个series的name值对应
     * @param   seriesName //名字
     * @param   symbolShape  // 默认是空心圆（中间是白色的），改成实心圆
     * @param   itemColor  // 会设置点和线的颜色，所以需要下面定制 line
     * @param   lineColor    // 线条颜色
     * 
     */ 

//生成图片的公共函数
  chartsCommon=(domElement, xAxisData, seriesData, legendData, seriesName,symbolShape,itemColor,lineColor)=> {
//定义响应式占父容器的百分比
    let resizeWorldMapContainer = function () {
      domElement.style.width = "100%";
    };
//执行方法
    resizeWorldMapContainer();
    let myChart = echarts.init(domElement);
    let option = {
      title: {
        text: ''
      },
      tooltip: {
        //触发类型，默认（'item'）数据触发，可选为：'item' | 'axis'
        trigger: 'axis'
      },
      legend: {
        //垂直安放位置，默认为全图顶端，可选为：'top' | 'bottom' | 'center' | {number}（y坐
     标，单位px）
        y: 'bottom',
        //legend的data: 用于设置图例，data内的字符串数组需要与sereis数组内每一个series的name
       值对应
        data: legendData
      },
      xAxis: {
        data: xAxisData
      },
      grid:{
        left:80,
        right:80
      },
      yAxis: {},
      series: [{
        name: seriesName,
        type: 'line',
        data: seriesData,
        symbolSize: 12,
        symbol: symbolShape,      // 默认是空心圆（中间是白色的），改成实心圆
        itemStyle: {
          normal: {
            color:itemColor ,  // 会设置点和线的颜色，所以需要下面定制 line
          }
        },
        lineStyle: {
          normal: {
            color:lineColor,    // 线条颜色
          }
        },
      }]
    };
    myChart.setOption(option);
   //屏幕发生变化持续执行在父容器的占比函数实行响应
    window.onresize = function () {
      resizeWorldMapContainer();
      myChart.resize();
    };
  };

2.方法调用公共封装的echarts方法

 chartsOncetestingUser=(dataX,dataY)=> {
    dataX为横坐标的值,类型数组.dataY为纵坐标的值,类型数组
    //调用公共的生成图片函数
    this.chartsCommon(
     //获取dom
      this.refs.linear_img_gdb,
      dataX,
      dataY,
      ['GDB生产值'],
      'GDB生产值',
      'square',
      '#999',
      '#b3b3b3'
    )
  };

3.html标签

<div ref='linear_img_gdb'></div>