提问者:小点点

AngularJS/ChartJS:获取当前序列


我目前正在使用Angular Chart(http://jtblin.github.io/Angular-Chart.js/)

我需要找到当前的数据集/系列索引。

在我的角度控制器中:

$scope.mainChart.series = ['Past year', 'Current year'];
$scope.mainChart.data = [
    [10, 20, 30, 40], // 2015 - Index 0
    [50, 60, 70, 80]  // 2016 - Index 1
];

points数组中存在属性_datasetindex。我的onClick功能是:

$scope.mainChart.onClick = function (points, event) {
    $log.log( points[0]._datasetIndex ); // 0
    $log.log( points[1]._datasetIndex ); // 1
};

我如何获得当前被点击的系列索引?

我的画布元素是:

<canvas id="line" class="chart chart-line" chart-data="mainChart.data" chart-labels="mainChart.labels" chart-click="mainChart.onClick" chart-series="mainChart.series" chart-options="mainChart.options" chart-y-axes="mainChart.multiAxis" chart-legend="true" height="270"></canvas>

共2个答案

匿名用户

列宁·梅扎:你的回答帮助了我。

在这里,我已经张贴了取标签和系列的快捷方式/替代方式。

$scope.mainChart.onClick = function (points, event) {
    // Get current chart
    var chart = points[0]._chart.controller;
    var activePoint = chart.getElementAtEvent(event);
    if (activePoint.length > 0) {
        // Get current Dataset
        var model = activePoint[0]._model;
        // Get current serie by dataset index
        var series =  model.datasetLabel;
        //get the internal index of slice in pie chart
        var clickedElementindex = activePoints[0]["_index"];
        //get specific label by index 
        var label = model.label;
        //get value by index      
        var value = chart.data.datasets[dataset].data[clickedElementindex];
    }
};

匿名用户

Angular-Chart环绕AngularJS+Chart.js。根据Chart.js,如果可以找到Chart实例,则可以使用http://www.chartjs.org/docs/#Advanced-Usage-Prototype-Methods..GetElementSatEvent(e)

否则,如果时间不够,可以执行以下操作。

首先,您需要区分所有的点,所以没有相同的点(标签和系列索引和数据集索引)。

function induceIndex(point){
//FIND the INDEX of the SET
var dataSetIndex= $scope.mainChart.series.findIndex(sElem=>sElem === point.dataSetLabel); 
//GET the SET itself
var dataSet = $scope.mainChart.data[seriesIndex]; 
//FIND the POINT in the DATASET asserting that it is at the same INDEX of its LABEL
var pointIndex = dataset.findIndex((dElem,index)=>dElem=== point.value && $scope.mainChart.labels[index] === point.label);
//do what you want
return pointIndex;
}