当前位置: 首页 > 知识库问答 >
问题:

AngularJS/ChartJS:获取当前序列

徐奇
2023-03-14

我目前正在使用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个答案

端木弘方
2023-03-14

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;
}
孙宏扬
2023-03-14

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

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

$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];
    }
};
 类似资料:
  • 问题内容: 我正在使用以下代码来获取当前网址 是否有其他方法可以获取相同的URL,或者可能是获取当前URL的更好方法? 谢谢。 问题答案: 从参考:

  • 问题内容: 我的网站在服务器上 为此,我有两个域, 和 我想使用PHP当前域,但是如果我使用,则可以告诉我 代替: 如何获取域而不是服务器名称? 我有PHP版本5.2。 问题答案: 尝试使用此: 或解析 apache_request_headers()

  • 问题内容: 考虑从ui-router文档获取的以下状态: 以及状态“ state1”的“ partials / state1.html”控制器: 是否有任何内置功能可从控制器内部或模板内部确定控制器/模板与哪个状态关联? 例如: 而且,如果没有内置解决方案,您将如何“装饰” $ state或$ stateParams以包含此信息? 我想出的唯一解决方案是使用$ state.get(),然后使用控制

  • 我正在为我的web应用程序使用Spring MVC。我的bean是在“”文件中编写的

  • 本文向大家介绍AngularJS通过$location获取及改变当前页面的URL,包括了AngularJS通过$location获取及改变当前页面的URL的使用技巧和注意事项,需要的朋友参考一下 注意 本文中获取与修改的URL以 ‘http://172.16.0.88:8100/#/homePage?id=10&a=100' 这个路径为例: 一. 获取url的相关方法(不修改URL): 1.获取当

  • 问题内容: 我将Spring MVC用于我的Web应用程序。我的豆子写在“ ”文件中 现在我有一个课,我想用Spring bean访问这个课。 在我写了以下 现在我需要使用 这样我就可以 这该怎么做?? 问题答案: 只需注入即可。 或实现此接口:ApplicationContextAware