javascript - 将鼠标光标移动到一个点时在 Highmaps 中显示不同的图像

Question

我正在尝试在 Highmaps 中实现下一个功能:当用户将鼠标光标移动到特定点时，图像将与文本数据一起显示，您知道，在任何 Highcharts 图表、股票或 map 上，关于该点的详细信息当用户将光标移动到该点时，会出现在一个小窗口中。

问题是我不知道如何在这些小容器中插入图像 - 我认为这篇文章 Showing image with variable src in tooltip of Highcharts scatter plot以某种方式与我的问题相关，但是(在大多数关于在 Highcharts 中嵌入图像的问题中)用户通常会尝试将图像静态插入到图例或工具提示中，因此他们的提示对我的情况没有帮助。

希望有人能帮助我。

Answer 1

您可以在点中包含所需的信息，例如:

series: [{
  data: [{
    image: 'http://path.to/my/image.png'
  }]
}]

然后使用相关问题中描述的格式化程序，但使用 image 属性:

tooltip: {
  useHTML: true,
  formatter: function() {
    return '<img src="' + this.point.options.image + '" height="150"/>';                
},