流光折线图

描述:当前是关于Echarts图表中的 折线图 示例。
 
            option = {
  xAxis: {
    type: 'category',

  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      name: '总数量',
      type: 'line',
         lineStyle: {
            color: 'black' // 设置第一条折线颜色
        },
      data: [502.84, 205.97, 332.79, 281.55, 398.35, 214.02]
    },
    //折线图流光配置
    {
      name: '滑行的光点',
      type: 'lines',
      coordinateSystem: 'cartesian2d',
      polyline: true,
      effect: {
        show: true,//是否展示
        period:10,//时间
        trailLength:0.1,//尾部长度
        symbolSize: 8,//点大小
        symbol: 'circle',//点的类型
        color: 'pink',//颜色
      },
      data: [{
      	//coords:[['x轴数据',y轴数据]] 一一对应拼接
        coords: [
            [0, 502.84],
            [1, 205.97],
            [2, 332.79],
            [3, 281.55],
            [4, 398.35],
            [5, 214.02],
        ]
      }]
    },
    // ==============================================
      {
      name: '注册总量',
      type: 'line',
      data: [90,89,87,48,37,48],
       lineStyle: {
            color: 'pink' // 设置第二条折线颜色
        },
    },
    //折线图流光配置
    {
      name: '滑行的光点',
      type: 'lines',
      coordinateSystem: 'cartesian2d',
      polyline: true,
      effect: {
        show: true,//是否展示
        period:10,//时间
        trailLength:0.1,//尾部长度
        symbolSize: 8,//点大小
        symbol: 'circle',//点的类型
        color: 'red',//颜色
      },
      data: [{
      	//coords:[['x轴数据',y轴数据]] 一一对应拼接
        coords: [
            [0, 90],
            [1, 89],
            [2, 87],
            [3, 48],
            [4, 37],
            [5, 48],
        ]
      }]
    }
  ]
};