javascript - Highcharts 气泡图中心点

Question

我试图在点点击时向气泡图添加一些额外的信息，但我怎么也找不到气泡点的中心!

这是发生的事情: http://jsfiddle.net/H07R0D/Mktvz/

这是点击事件

plotOptions: {
    bubble: {
        cursor: 'pointer',
        point: {
            events: {
                click: function() {
                    var renderer = this.series.chart.renderer;
                    var point = this.graphic;
                    var path = renderer.path(['M',point.cx,point.cy,'L',100,100])
                        .attr({
                            'stroke-width': 1,
                            stroke: 'red'
                         }).add();
                 }
            }
        }
    }
}

当单击气泡时，我尝试绘制从气泡中心到任意点的路径(只是测试......)，但绘制的路径永远不会从气泡中心开始。

除了 point.cx 和 point.cy 之外，我应该使用其他值吗？

Answer 1

这是您的解决方案:

var plotBox = point.renderer.plotBox;
var path = renderer.path(['M',point.cx+plotBox.x,point.cy+plotBox.y,'L',100,100])

事实上，你的图形并不是从 svg 的 0,0 开始，它有一个偏移量。您可以在每个对象的渲染器中找到它。您的图形包含在绘图框中。

我已经更新了你的 jsFiddle :http://jsfiddle.net/FsDks/