line折线图

[wuyuedefeng]

import * as Echarts from 'echarts'
{
  title: {
    text: '标题',
    textStyle: {
      color: '#fff',
      fontSize: 14,
    },
    padding: [25, 0, 5, 20]
  },
  grid: { // 让图表占满容器
    top: 60,
    left: 40,
    right: 40,
    bottom: 40,
    containLabel: true, // label是否包含在边界中
  },
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value',
    splitLine:{
      show: true, // 是否显示x轴分割线
      interval: 'auto', // 坐标轴分隔线的显示间隔
      lineStyle: {
        color: ['rgba(255,255,255,0.3)'], // 分隔线颜色。
        width: 1, // 分隔线线宽
        type: 'dashed', // 线的类型
        opacity: 1 // 图形透明度。支持从 0 到 1 的数字，为 0 时不绘制该图形。
      }
    },
  },
  series: [
    {
      type: 'line',
      smooth: true,
      symbol: 'none',
      //seriesLayoutBy: 'row',
      //sampling: 'average',
      itemStyle: {
        color: '#FF623B'
      },
      areaStyle: {
        color: new Echarts.graphic.LinearGradient(0, 0, 0, 1, [
          {
            offset: 0,
            color: 'rgba(255,98,59,1)'
          },
          {
            offset: 1,
            color: 'rgba(255,98,59,0)'
          }
        ])
      },
      data: [1, 3, 2, 5, 4, 8, 3],
    }
  ]
}