剑道UI角度2+图表 - 系列工具提示模板 - 访问类别值和其他数据



我正在使用剑道图表组件和类型为"线"的系列项目。

根据此处的文档,可以将当前值用作系列工具提示模板中的占位符。

是否也可以访问模板中的当前类别? 如果我绑定到对象而不是基元值,是否可以访问当前数据项而不仅仅是值?

谢谢

有办法。提供的文档并不简单,我也发现它令人困惑。

可以通过声明变量并将其设置为类别来访问当前类别

如果使用对象来设置剑道图表系列项的数据,则该对象的其他属性也可以用作工具提示。 我们在此处使用dataItem属性来访问我设置的数据的其他属性。

<kendo-chart-series-item-tooltip>
<ng-template let-value="value" let-category="category" let-dataItem="dataItem">
Number of children: {{ dataItem.number }}
</ng-template>
</kendo-chart-series-item-tooltip>

在这里,数组中的每个 dataItem 对象都可以设置为工具提示 可在此处找到可访问的工具提示属性的完整列表。

http://www.telerik.com/kendo-angular-ui/components/charts/api/TooltipTemplatePoint/#toc-category

工作代码

<kendo-chart>
<kendo-chart-tooltip>
<ng-template kendoChartSeriesTooltipTemplate let-value="value">
Default Content {{ value }}
</ng-template>
</kendo-chart-tooltip>
<kendo-chart-title text="% children with conscientious objection recorded"></kendo-chart-title>
<kendo-chart-category-axis>
<kendo-chart-category-axis-item
[categories]="['1999', '2000', '2001']"
[title]="{ text: 'Years' }">
</kendo-chart-category-axis-item>
</kendo-chart-category-axis>
<kendo-chart-series>
<kendo-chart-series-item type="column" [data]="testData" field="percent" >
<kendo-chart-series-item-tooltip>
<ng-template let-value="value" let-category="category" let-dataItem="dataItem">
Number of children: {{ dataItem.number }}
</ng-template>
</kendo-chart-series-item-tooltip>
</kendo-chart-series-item>
</kendo-chart-series>
</kendo-chart>

在打字稿文件中声明下面的测试数据对象

testData = [{
date: 1999,
percent: 0.23,
number: 4271
},
{
date: 2000,
percent: 0.41,
number: 7624
},
{
date: 2001,
percent: 0.55,
number: 9987
}]

在这里,我使用对象的 number 属性作为工具提示。希望这有帮助。如果您无法解决,请告诉我。乐于提供帮助

最新更新