javascript - 以编程方式更改 Highmaps 中的形状颜色

Question

我有一张用 Highmaps 库制作的 map ，由两个系列组成:管理边界和城市。在它的一侧有一个所有管理员的列表，并且在每个项目上都附加了一个鼠标悬停事件。当鼠标悬停在管理文本上时，我尝试突出显示而不选择 map 上的相对形状。我已经能够使用 highmaps 的选择功能来实现它，但我不能再使用它了，因为我还启用了多重选择，并且我将它用于其他目的。

所以我想做的是手动/以编程方式更改系列中特定点的颜色。

这是在列表项上的鼠标悬停事件中执行的代码

$( "ul#admins li" ).mouseover(function() {
   var adminCode = $(this).attr('id')); //retrieve the adminCode
   var chart = $('#mapContainer').highcharts();
   for (var i = 0; i < chart.series[0].data.length; i++) {
       if (chart.series[0].data[i].Code == adminCode) {
           //I've got the map element to highlight...
           //..but how I can do change its color?

           //before I was using this method, selecting directly, but now
           //I don't want to select it, only change its color.
           chart.series[0].data[i].select(true, false);
           break;
       }
   }
});

Answer 1

您应该能够使用 Point.update() 更改 map 中特定国家/地区的颜色:

function(chart) {
    $('.btn').click(function() {
      chart.series[1].data[0].update({
        color: 'red'
      })
    })
}

例如，我正在更改 map 系列中第一个点的颜色。

在这里您可以看到它如何工作的示例:http://jsfiddle.net/x14dm93u/