highcharts-チャート

Question

は、誰かがあなたが動的にツールチップの内容を計算するpointFormatterを使用することができますhighcharts中に気泡

Answer 1

のノーを取得する方法に私を導いでした。コールバックでは、ホバリングされたバブルが他のバブルと重なっているかどうかを確認できます。

function areOverlapping(bubble1, bubble2) { 
    const {translateX: tx, translateY: ty } = bubble1.series.group 

    const x1 = tx + bubble1.plotX 
    const y1 = ty + bubble1.plotY 
    const r1 = bubble1.marker.radius 

    const x2 = tx + bubble2.plotX 
    const y2 = ty + bubble2.plotY 
    const r2 = bubble2.marker.radius 

    const x = x1 - x2 
    const y = y1 - y2 
    const r = r1 + r2 

    return x * x + y * y <= r * r 
} 

Tooltip.pointFormatter：

series: [{ 
    tooltip: { 
    pointFormatter: function() { 
     const overlapCount = this.series.data.reduce((sum, point) => { 
     return sum + (point !== this && areOverlapping(this, point)) 
     }, 0) 

     return 'Overlapping bubbles: ' + overlapCount 
    } 
    }, 

例：https://jsfiddle.net/0yzkfdjr/