将 highcharts mapbuble 类型更改为自定义图像答案

【问题标题】：Change highcharts mapbuble type to custom images将 highcharts mapbuble 类型更改为自定义图像
【发布时间】：2014-08-19 09:55:09
【问题描述】：

有没有办法将highcharts mapbubble类型的气泡更改为您计算机上的图像？

就像在这个例子中改变蓝色气泡：

type: 'mapbubble',
mapData: mapData,

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/maps/demo/map-bubble/

我想加载地图标记而不是圆圈，但仍然基于相同的数据，我该怎么做？

【问题讨论】：

地图标记应该像气泡一样扩大/缩小？
重要的是地图标记是我想要的图像而不是气泡

标签： highcharts

【解决方案1】：

使用mappoint系列，这里可以设置series.marker.symbol，可以是图片。

示例：http://jsfiddle.net/x5r6or8b/1/

唯一的问题是您需要为所有点获取正确的 x/y 坐标。我通过获取每个气泡的 x/y 生成了这些值：http://jsfiddle.net/x5r6or8b/ 并将其重用于演示。

系列代号：

        series: [{
            name: 'Countries',
            mapData: mapData,
            color: '#E0E0E0',
            enableMouseTracking: false
        }, {
            type: 'mappoint',
            mapData: mapData,
            name: 'Population 2010',
            data: mapPoints,
            minSize: 4,
            maxSize: '12%',
            tooltip: {
                pointFormat: '{point.code}: {point.z} thousands'
            },
            marker: {
                symbol: 'url(http://highcharts.com/demo/gfx/sun.png)'
            }
        }]

【讨论】：

Highmaps 类型（如 mappoint）及其选项是否在某处进行了详细描述？似乎缺少 API。
哦，看来docs 的地图点已损坏。我们会解决的，谢谢！其余系列类型工作正常。

【解决方案2】：

你不需要使用mappoint，你也可以改变'mapbubble'中的标记符号。它会正常工作的。

【讨论】：