highcharts - highcharts mapchart：重新加载图表后不显示颜色

Question

我是新来的高图表。

下面是我在创建 mapChart 时在函数中的部分代码，它的作用是仅将匹配区域（带有 cur_state）显示为红色，而将其他区域显示为蓝色。

                chart: {
                    backgroundColor: null,
                    map: 'countries/au/au-all',
                    events: {
                        load: function () {
                            // place1
                            this.series[0].data = this.series[0].data.map((el) => {
                                // place2
                                if (el['hc-key'] == region_dict[cur_state][1]) {
                                    el.color = "#ff0000";
                                    return el;
                                }
                                el.color = "blue"
                                return el
                            })

                            this.update({
                                series: [{
                                    data: this.series[0].data
                                }]
                            })
                        }
                    }
                },

当 cur_state 的值发生变化时，我想起了包含地图图形的函数，希望相应的区域有颜色更新。

这是我第一次调用该函数：

这是我第二次调用该函数后，着色和悬停效果消失了：

经过测试，发现第一次创建图表时会执行place1和place2，重新创建图表时只执行place1。

我的另一部分代码具有与此类似的结构：https ://jsfiddle.net/gh/get/library/pure/highslide-software/highcharts.com/tree/master/samples/mapdata/countries/au/au-all

我怎样才能达到预期的结果？

感谢您的帮助

标签： highcharts

Answer 1

在您的情况下，最好的解决方案似乎是使用渲染事件并更改 SVG 级别的颜色。例子：

    chart: {
        ...,
        events: {
            render: function() {
                this.series[0].points.forEach(function(point) {
                    if (point['hc-key'] == state) {
                        point.graphic.attr({
                            fill: 'red'
                        });
                    }
                });
            }
        }
    }

---

现场演示： https ://jsfiddle.net/BlackLabel/x69pLcyo/

API参考：

https://api.highcharts.com/highcharts/chart.events.render

https://api.highcharts.com/class-reference/Highcharts.SVGElement#attr