ハイチャート - オーバーラップするエリアラインのポイントをクリックして処理する

Question

シリーズの特定のポイントをクリックするたびにポイントの詳細を取得する必要がありますが、エリアラインのオーバーラップポイントをクリックしてもクリックイベントは発生しません。シリーズのポイントが正面にある場合にのみトリガされます。

 plotOptions: { 
      series: { 
       events: { 
        click: function(event) { 
         alert(this.name); 
        } 
       } 
      } 
     }, 

小さなfiddleを示しました。

ありがとうございました。

Answer 1

trackByAreaオプションをtrueに設定すると、シリーズが別のシリーズの背後にある場合でもクリックイベントを捕捉できます。

plotOptions: { 
      series: { 
       trackByArea: true, 
       events: { 
        click: function(event) { 
         alert(this.name); 
        } 
       } 
      } 
     }, 

例：http://jsfiddle.net/83x6L69x/

しかし、これはあなたが正確にポイントにない場合でも、クリックイベントをキャッチします。

 plotOptions: { 
     series: { 
      trackByArea: true, 
      point: { 
      events: { 
       click: function(e) { 
       console.log(this) 
       const group = this.series.group 
       const x = e.chartX - this.plotX - group.translateX 
       const y = e.chartY - this.plotY - group.translateY 
       const d = (x * x + y * y) 

       const rPlus = this.graphic.states.hover.radiusPlus // it is an additional radius when the point is hovered 
       const r = this.graphic.radius + (rPlus || 0) 

       if (x * x + y * y <= r * r) { 
        alert(this.series.name) 
       } 
       } 
      } 
      } 
     } 
     }, 

例：http://jsfiddle.net/dh4zn6h4/

クリックイベントがポイントのマーカーの内部で行われていた場合、それを避けるために、あなたは確認することができます