折线图

var xData = [0, 1, 2, 3, 4, 5]; 
var xDatas = [0.1, 0.2, 0.3, 0.4, 0.5, 0.6]; 
var yData = [250, 200, 170, 150, 125, 230];

option = {
  title: {
    text: '折线图示例'
  },
  tooltip: {
    trigger: 'axis'
  },
  grid: {
    left: '10%',
    right: '10%',
    bottom: '15%'
  },
  xAxis: {
    type: 'category',
    name: 'α',
    nameLocation: 'center',
    nameGap: 30,
    data: xDatas,
    max: 5,
    axisTick: {
      alignWithLabel: true
    },
    axisLine: {
      lineStyle: {
        width: 3 // 底部轴线加粗
      }
    },
    splitLine: {
      show: false
    }
  },
  yAxis: {
    type: 'value',
    name: '信号测量数量 M',
    nameTextStyle: {
      fontStyle: 'italic',
      fontFamily: 'Romal'
    },
    nameLocation: 'center',
    nameGap: 50,
    mix: 0,
    max: 300, // 设置 Y 轴最大值为 300
    axisLine: {
      show: true,
      lineStyle: {
        width: 2 // 左侧轴线加粗
      }
    },
    splitLine: {
      show: true,
      lineStyle: {
        type: 'solid',
        color: '#000'
      }
    }
  },
  series: [
    {
      data: yData,
      type: 'line',
      smooth: false,
      label: {
        show: true,
        position: 'top',
        formatter: '{c}',
        fontWeight: 'bold',
        fontSize: 12
      },
      itemStyle: {
        color: function (params) {
          return params.dataIndex === 4 ? 'red' : 'blue';
        }
      },
      lineStyle: {
        color: 'blue'
      },
      markLine: {
        silent: true,
        symbol: 'none',
        label: { show: false },
        data: xData.map((x) => {
          return {
            xAxis: x,
            lineStyle: {
              type: 'solid',
              color: '#000',
              width: 1
            }
          };
        })
      }
    }
  ]
};

1901.png