HighMaps - 需要使数据标签可点击

Question

我正在使用小 U.S。在 HighMaps 中映射，我希望每个州及其数据标签在单击时打开一个新的 URL。我的状态正常，但标签不起作用。

这是我试过的：

plotOptions: {
                series: {
                    allowPointSelect: true,
                    point: {
                        events: {
                            click: function(e) {
                                const url = e.target.point.value;
                                window.open(url);
                            }
                        }
                    },
          datalabels: {
                        events: {
                            click: function(e) {
                                const url = e.target.point.value;
                                window.open(url);
                            }
                        }
                    }
                }
            },

代码请见https://jsfiddle.net/sfjeld/zcsxobfa/12/。

Answer 1

在您的示例中，您可以使用：

e.point.properties.hasc

获取点击点的值。

代码：

plotOptions: {
  series: {
    allowPointSelect: true,
    point: {
      events: {
        click: function(e) {
          const url = "https://www.google.com/search?q=" + e.point.properties.hasc;
          window.open(url);
        }
      }
    },
  }
},

您可以使用此路径检查其他值：

console.log(e.point.properties);

完整代码在this forked jsfiddle

Answer 2

使用this.value代替e.target.point.value:

plotOptions: {
  series: {
    point: {
      events: {
        click: function() {
          const url = this.value;
          window.open(url);
        }
      }
    }
  }
}

演示： https://jsfiddle.net/BlackLabel/6gpL57nf/

HighMaps - 需要使数据标签可点击

HighMaps - need to make datalabels clickable

highcharts