Question

我目前正在使用角度图（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
];

在点数组中存在属性_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>

Answer 1

Angular-Chart包含在AngularJS + Chart.js中。根据Chart.js，如果您能找到图表实例，则可以使用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;
}

Answer 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 dataset = activePoint[0]._datasetIndex;
        // Get current serie by dataset index
        var serie = $scope.mainChart.series[dataset];
        //get the internal index of slice in pie chart
        var clickedElementindex = activePoints[0]["_index"];
        //get specific label by index 
        var label = chart.data.labels[clickedElementindex];
        //get value by index      
        var value = chart.data.datasets[dataset].data[clickedElementindex];
    }
};

Answer 3

Lenin Meza：你的回答帮助了我。

在此，我发布了获取标签和系列的快捷方式/备用方式。

$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];
    }
};

AngularJS / ChartJS：获取当前系列

3 个答案: