ChartJS：棒グラフでクリックしたときのラベルの値を取得

Question

Angular JSの棒グラフでクリックしたときにラベルの値を取得したいとします。私は、HTMLテンプレートを持っています。ここ

<canvas id="bar" class="chart chart-bar" chart-data="data" 
           chart-labels="labels" chart-legend="true" height="350" 
           chart-series="series" chart-click="onClick"> 
</canvas> 

は、クリックイベントのための私のJSです：棒グラフ上でクリックしたときに、私が何をしたいのか

$scope.onClick = function (points, evt) { 
           console.log("Chart clicked", points, evt); 
           console.log(points); 
           if(points.length > 0){ 
            console.log("Bar chart clicked"); 
            console.log("Point", points[0].value); 

           } 
           }; 

は、ラベルの値を表示することです、より多くの具体的には_model - > labelの値を取得したいと考えています。以下は、コンソールに何が印刷されるかの写真です。

この行：console.log("Point", points[0].value);は未定義を返します。

ありがとうございます！

Answer 1

$scope.onClickコールバックに3番目の変数を含めると、特定のバーをクリックすると定義されます。

HTMLで

：私はX軸に沿ってyearごとに複数のバーをレンダリングし、元々ちょうど2つのコールバック変数を使用しますが、すべての_pointsた

ctrl.onClick = function(_points, _event, barClicked) { 
    if (barClicked) { 
    var associatedLabel = barClicked._model.datasetLabel; 
    console.log("Label of the bar you clicked is " + associatedLabel); 
    } 
} 

：コントローラで

<canvas id="bar" 
     ... other stuff ... 
     chart-click="ctrl.onClick"> 
</canvas> 

私がクリックした年内にすべてのチャート要素が私に与えられていました。上記は、私がクリックした正確なバーを私に与えました。

ChartJSのドキュメントでこれを見つけることができなかったので、すべてのケースに該当するかどうかはわかりませんが、私には不思議に思っていました。乾杯！