onclickは、ドーナツチャートの情報を中心に表示します

Question

ステータスページのハイチャートを作成しようとしていますが、ドーナツの一部がクリックされるたびに切り離されますが、それに含まれる情報しかし、ドーナツチャートの中心に、私はそれを動作させることはできません。

私はクリックした部分のデータをグラフの下の範囲に置くクリック機能を作成することができましたが、これを行うためのより良い方法があります。

  series: { 
      point: { 
       events: { 
        click: function() { 
         $("#displayStats").text(this.name + this.y); 
         }, 
        load: function() { 
        var chart = this, 
         rend = chart.renderer, 
         pie = chart.series[0], 
         left = chart.plotLeft + pie.center[0], 
         top = chart.plotTop + pie.center[1], 
     text = rend.text("text", left, top).attr({ 'text-anchor':'middle'}).add();    
          } 
        } 
       } 
      } 
     }, 

、以下のあなたがポイントのクリックで、あなたのチャートでカスタムラベルを追加するためのchart.rendererを使用することができます

jsFiddle

Answer 1

を読み取るためのおかげで、私のバイオリンを確認してください：ここでは

addLabel = function(point) { 
    $('.cLabel').remove(); 
    var text = point.name + ': ' + point.y, 
     chart = point.series.chart, 
     renderer = chart.renderer; 
    chart.renderer.label(text, chart.chartWidth/2, chart.chartHeight/2).attr({ 
     'text-anchor': 'middle', 
    }).addClass('cLabel').add(); 
    }; 

どのように動作するかの例を見ることができます：https://jsfiddle.net/ucweax9h/13/