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回調中包含第三個變量，該回調在您單擊特定欄時進行定義。

在HTML：

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

在控制器：

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

我每year沿X軸渲染多個酒吧和最初使用只是兩個回調變量，但所有_points給我的是我點擊的一年內的所有圖表元素。上面給了我點擊的確切欄。

我無法在ChartJS文檔中找到它，所以我不確定它是否適用於所有情況，但對我來說卻是奇蹟。乾杯!