javascript - 使用 Highcharts 按 ID 选择点

Question

使用 Highcharts，我如何使用它的 id 选择一个点？例如，如果我使用以下代码创建图表:

 chart1 = new Highcharts.Chart({
         chart: {
            renderTo: 'container',
            type: 'scatter'
         },
         title: {
            text: 'Fruit Consumption'
         },
         xAxis: {
            categories: ['Apples', 'Bananas', 'Oranges']
         },
         yAxis: {
            title: {
               text: 'Fruit eaten'
            }
         },
         series: [{
            name: 'Jane',
            data: [{
                name: 'Point1',
                x: 1,
                y: 2
            }, {
                name: 'Point2',
                x: 2,
                y: 5
            }]
         }, {
            name: 'John',
            data: [5, 7, 3]
         }]
      });
   });

工具提示告诉我，当我将鼠标悬停在某个点上时，id 是什么。但是，我无法弄清楚识别该点的语法。我知道 chart1.series[0].name 返回 Jane。还有，chart1.series[0].data[0].name返回point1` 有没有一种简单的方法可以让我只知道“point1”就可以选择点并更改颜色？

我想知道是否有比每次循环遍历所有点更有效的方法。

Answer 1

你可以为每个你想得到的点设置一个id。

series: [{
    name: 'Jane',
    data: [{
        'name': 'Point1',
        'id': 'point1',
        'x': 1,
        'y': 2
    }, {
        'name': 'Point2',
        'id': 'point2',
        'x': 2,
        'y': 5
    }]
}, {
    name: 'John',
    data: [5, 7, 3]
}]

那么通过下面的代码就可以获取到要点了。

// assuming that chart is your chart var
chart.get('point1');

demo

或者，如果您不想设置 id，您可以简单地循环遍历 points 来比较您想要查找的 name 点名称。

引用:

• http://api.highcharts.com/highstock#object-Chart