Angular Highcharts-折线图标记选定点

我的angular应用程序上有一个折线图。我需要做的是，当我点击图表的任何一点时，标记该点以将其与其他点区分开来。下面是我的图表配置：

highcharts = Highcharts;
  chartOptions = {
    chart: {
       type: "line"
       },
    credits: {
      enabled: false
    },
    title: {
      enabled: true,
      text: "Reach +1/" + this.xAxis.name,
      verticalAlign: "top",
      align: "left"
    },
    tooltip: {
      formatter: function (data) {
          return data.chart.userOptions.xAxis.title.text + ": " + this.x.toFixed(4) + "<br/>" +
              "Reach: " + this.y.toFixed(4);
      }
  },
    xAxis: {
      title: {
        text: this.xAxis.name
      },
    },
    yAxis: {
       title: {
          text: "Reach"
       }
    },
    series: [
      {
        name: this.xAxis.name,
        data: null,
        allowPointSelect: true,
        point: {
          events: {
            click: function(event) {
              this.yPoint = event.point.y;
              this.xPoint = event.point.x;
              this.filterOptimizationResults(this.xPoint, this.yPoint);
              }.bind(this)
            },
          },
          state: {
            select: {
              enabled: true
            }
          }
        }
      ]
    };

下面我分享了一个图表屏幕，以供参考：

---

例如，如果y选择点25,75，我需要圈出该点。

以下是如何使用point.update和events.click功能实现点切换的基本示例

演示：

API:

---

API:

好的，这是一种方法，它标记所有单击的点，我只想标记当前点。这种方法打破了我以前的onClick函数。非常感谢你的帮助。如果你能帮我弄清楚如何只标记选中的点，那就太好了，所以你想在点击后只标记一个点吗？比如：没有标记，点[x1，y1]被单击-标记出现，下一点[x5，y5]被单击-他的标记出现，但上一个隐藏？确切地说，我只想一次标记一个点。hideI应该看到的上一个示例，请查看此演示：

point: {
  events: {
    click() {
      let point = this;

      if (point.marker && point.marker.enabled) {
        point.update({
          marker: {
            enabled: false
          }
        })
      } else {
        point.update({
          marker: {
            enabled: true
          }
        })
      }
    }
  }
}