使用angular-chart.js中的chart-dataset-override选项

发布时间：2020-12-17 10:23:50 所属栏目：安全来源：网络整理

导读：我正在撰写预算管理申请表,我正在使用angular-chart.js. 我想使用数据集来覆盖初始数据(主要是为了向图表添加新数据,并为每个条形图,标签等提供不同的颜色),并根据数据的值设置标签和颜色. 目前,我试图做硬编码,但只有第一个值是覆盖. 这是我正在使用的代码

我正在撰写预算管理申请表,我正在使用angular-chart.js.

我想使用数据集来覆盖初始数据(主要是为了向图表添加新数据,并为每个条形图,标签等提供不同的颜色),并根据数据的值设置标签和颜色.
目前,我试图做硬编码,但只有第一个值是覆盖.

这是我正在使用的代码：

angular.module("app2",["chart.js"]).controller("MixedChartCtrl",function($scope) {
    $scope.colors = ['#45b7cd','#ff6384','#ff8e72'];

    $scope.labels = ['',''];
    $scope.data = [65,11];
    $scope.datasetOverride = [

        {
            label: 'Override Series A',borderWidth: 1,type: 'bar',data: [345]
        },{
            label: "Bar chart1",data: [45]
        }

    ];
});

希望您的问题是,您需要填充颜色/标签/某些东西到每个单独的数据(对于每个条).

当您有两个数据集时,将使用上方(您的)代码段.
当必须为所有数据设置相同的属性值时,所有这些数据集属性都将接受String,并且当您要为同一数据集中的不同数据设置不同的属性值时,它们也将接受Array [String]. (如下).

$scope.data = [65,11];
$scope.datasetOverride = [
{
  label: ['something','otherthing'],borderWidth: [1,2],backgroundColor: ['#FF4242','#2291ff']
}
]

所以现在我明白你可能会添加动态数据.
所以你必须将数据推送到DATASET,如下所示：

$scope.data.push(345);

因此,如果要为这些设置不同的属性,则需要推送属性(数组).

$scope.datasetOverride[0][label].push('someother thing');
$scope.datasetOverride[0][borderWidth].push(2);
$scope.datesetOverride[0][backgroundColor].push('#46bfb8');

这将在前一个栏旁边添加一个带有新颜色/标签/等的栏.

我希望我理解你的问题,这将有所帮助.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!