javascript - 在 Highchart JS 中的气泡图上显示自定义鼠标悬停

Question

我有一个通过 HighChart JS 模块制作的气泡图。气泡图是正常的，正在做它应该做的事情，我遇到的唯一问题是我想要在数据气泡上悬停时进行自定义输出。

看看我在这里创建的 JSFiddle :- http://jsfiddle.net/DUvQW/8/

如果您将鼠标悬停在图表上的任何气泡上，它会显示一个 float 条，其输出如下:-

Mexico
(1354, 1352), Size: 1928)

我希望它能给我一个输出:-

 Mexico
 (1354, 1352) 
 Year: 2000,
 Size: 1928)

附注正如您在值中看到的，我已经添加了第四个参数作为一年。

有什么想法吗？

谢谢。

Answer 1

将系列数据重构为对象数组:

    {
        name: 'South Korea',
        id: 6,
        argumentField: 'total6',
        valueField: 'perc6',
        sizeField: 'older6',
        tagField: 'tag6',
        visible: false,
        data: [
            {x:160, y:801, z:1955, year:2000},
            {x:433, y:1653, z:1910, year:2005},
            {x:614, y:1432, z:1918, year:2014},
            {x:724, y:372, z:1950, year:2004},
            {x:434, y:936, z:1920, year:2003}
        ]
    }

会让生活变得更加轻松......

然后使用自定义tooltip :

   tooltip: {
        formatter: function() {
            var t = this.series.name;
            t += '<br/> (' + this.x + ',' + this.y + ')';
            t += '<br/> Year: ' + this.point.year + ',';
            t += '<br/> Size: ' + this.point.z;
            return t;
        }
    },

更新了 fiddle here (注意，我只修改了韩国的数据)。