为图表数据赋值时的tc angular chartjs问题



我想用存储在数组中的名称设置图表数据,但它不起作用。我将数组名称存储到一个数组中,并用ng repeat为图表数据分配名称,但图表数据不从数组中获取任何名称,它不会显示。只有在直接分配名称时,它才会显示图表。

<div  ng-repeat="x in data123">
<h4>{{x}}</h4>
<canvas tc-chartjs-doughnut chart-options="options1" chart-data=x auto-legend></canvas>
</div>

阵列是

$scope.data123=['basketballl','Dancee'];

只有当

<canvas tc-chartjs-doughnut chart-options="options1" chart-data=Dancee auto-legend></canvas>

如何将数组值分配给图表数据

我也试过

chart-data={{x}}
chart-data="x"

没有一个工作

chart.js最初只接受标签和值属性,颜色和所有属性除外。您需要更改chart.js提供的脚本。。假设你来自数组的属性是xyz。。你需要在像segment.xyz这样的脚本中craete一个片段,或者用你的属性名替换标签

希望它的vl有助于

图表数据只使用数组,而不使用存储在数组中的数组名称。如果您想使用ng repeat显示多个图,请将聊天数据的数组与其他数据一起插入另一个数组中。

$scope.data1.push({
    value: data.Group[i].Count[j],
    color: chartColor[j],
    highlight: chartColor[j],
    label: data.Group[i].options[j]
    }); 
$scope.groupDet.push({'groupid':data.Group[i].groupID,
                   'groupName':data.Group[i].groupName ,
                   'ff':$scope.data1
                 });
<div  ng-repeat="x in groupDet">
<h4>{{x.groupName}}</h4>
<canvas tc-chartjs-doughnut chart-options="options1" chart-data=x.ff auto-legend></canvas>

最新更新