クリックプロンプトのオプションonclickイベント

Question

私の反応アプリケーションでハイチャートの縦棒グラフを作成しましたが、グラフにonClickイベントを追加しようとしています。私の目的は、ユーザーが列をクリックすると、X軸とY軸の値を取得して、ページから関数を呼び出すことができるということです。

次のようにonClickイベントは、は、plotoptionsを使用して達成される：

plotOptions={{ 
    series: { 
    cursor: 'pointer', 
    point: { 
     events: { 
     click:() => { 
      this.fuction.call(this, 1); 
     } 
     } 
    } 
    } 
}} 

これに伴う問題は、私は関数を呼び出すことができますが、私は、列の値にアクセスすることができないということです。

だから、私はこれを試してみてください。

plotOptions={{ 
    series: { 
    cursor: 'pointer', 
    point: { 
     events: { 
     click: function() { 
      console.log(this); 
     } 
     } 
    } 
    } 
}} 

この方法で、私はthisて、列の値にアクセスすることができますが、これは現在のページオブジェクトを保持していないとして、関数を呼び出すことはできません。

私の質問は、どのように2つを組み合わせることができるのですか？そのため、選択した列の値にアクセスしてページ上の関数を呼び出すことができますか？

私はこれを試してみました：

plotOptions={{ 
    series: { 
    cursor: 'pointer', 
    point: { 
     events: { 
     click: function (e) { 
      console.log(this); 
      console.log(e); 
     } 
     } 
    } 
    } 
}} 

私にonClickイベントを与え

、および列ではなく現在のページオブジェクトを。

また、私はこれを試してみました：

plotOptions={{ 
    column: { 
    cursor: 'pointer', 
    point: { 
     events: { 
     click: (e) => { console.log(this); console.log(e); } 
     } 
    } 
    }      
}} 

しかし、これはまた、私は必要なものを私に与えるものではありません。

私は、これは非常に難しいことではありません確信して、私はちょうど

Answer 1

plotOptions={{ 
    series: { 
    cursor: 'pointer', 
    point: { 
     events: { 
     click: (e) => { console.log(this); console.log(e.point.category); console.log(e.point.y); } 
     } 
    } 
    } 
}} 

のようなものです

今すぐthisには現在のページの状態が含まれています。e.point

Answer 2

あなたはこれを試してみました...それか、正しい検索用語を見つけることができませんか？

click: function(e) { 
    console.log(
     e.yAxis[0].value, e.xAxis[0].value 
    ) 
} 

あなたはこのリンク以下のよりに関する情報を見つけることが

：plotOptionのクリックイベントで

http://api.highcharts.com/highcharts/chart.events.click

Answer 3

この

JS Binデモ

plotOptions: { 
    series: { 
     cursor: 'pointer', 
     point: { 
      events: { 
       click: function() { 
        console.log('X: ' + this.x + ', Y: ' + this.y); 
        //call function passing this values as arguments 
       } 
      } 
     } 
    } 
},