在echarts中使用series-line.markPoint. symbol对被点击的节点进行标记

在ECharts中，`series-line.markPoint` 是一种用于在折线图系列中添加特殊点的功能，特别是标记点（Mark Point）。当你想要在图表上某些特定的位置添加可交互的标记，比如高亮显示某个数据点，可以利用 `symbol` 属性来定制这些标记的形状，例如 `'circle'`, `'diamond'`, `'triangle'` 等。

要实现点击事件并针对被点击的节点进行标记，你需要做以下几个步骤：

1. 首先，在配置项中定义 series 的 markPoint 部分，指定需要标记的数据点及其对应的坐标位置和样式，如 `data` 数组里包含 `{name: '点名', coord: [x, y]}` 对象，并设置 `symbol` 属性。

option = {
  xAxis: ...,
  yAxis: ...,
  series: [
    {
      type: 'line',
      data: ...,
      markPoint: {
        data: [
          { name: '点A', coord: [x1, y1], symbol: 'circle' },
          { name: '点B', coord: [x2, y2], symbol: 'diamond' }
        ]
      }
    }
  ]
};

2. 使用 ECharts 提供的事件监听功能，通常通过 `chart.on('click', function(param) { ... })` 来捕获点击事件。在这个回调函数中，你可以检查点击事件的参数，找出被点击的节点并相应地操作它，如改变颜色、显示提示等。

chart.on('click', function(params) {
  var points = option.series[0].markPoint.data;
  for (var i = 0; i < points.length; i++) {
    if (params.name === points[i].name) {
      // 根据需要更改节点状态，如:
      points[i].style.color = '#ff0000'; // 更改为红色
      break;
    }
  }
});