echart折线图如何在边上显示数据

要在 ECharts 折线图的边上显示数据，你可以使用 ECharts 的标记点和标记线功能来实现。下面是一个简单的示例代码，演示了如何在折线图的边上显示数据：

// 导入 ECharts
import echarts from 'echarts';

// 初始化图表实例
const chart = echarts.init(document.getElementById('chart'));

// 定义数据
const data = [
  { name: 'A', value: 20 },
  { name: 'B', value: 30 },
  { name: 'C', value: 25 },
  { name: 'D', value: 40 },
  { name: 'E', value: 15 }
];

// 设置图表配置项
const option = {
  xAxis: {
    type: 'category',
    data: data.map(item => item.name)
  },
  yAxis: {
    type: 'value'
  },
  series: [{
    type: 'line',
    data: data.map(item => item.value),
    markPoint: {
      data: [{
        type: 'max',
        name: '最大值'
      }, {
        type: 'min',
        name: '最小值'
      }],
      label: {
        show: true,
        position: 'top',
        formatter: '{c}'
      }
    }
  }]
};

// 渲染图表
chart.setOption(option);

在上面的代码中，我们使用 `markPoint` 配置项来设置标记点，并设置 `label` 的属性来显示数据。`position` 属性用于指定标记点的位置，可以选择 `'top'`、`'bottom'`、`'left'` 或 `'right'`。`formatter` 属性用于格式化显示的数据，`'{c}'` 表示显示当前数据值。

你可以根据自己的需求修改代码中的数据和配置项，以适应你的具体场景。希望对你有帮助！如果还有其他问题，请继续提问。