Kendo-ui Angularjs 中的工具提示
Kendo-ui tooltip in Angularjs
我写了一个简单的 kendo-ui 应用程序,它显示来自 JSON 的饼图。我使用了 AngularJS,但找不到有关当用户将鼠标悬停在图表上时如何显示工具提示的参考。
编码片段:
<div kendo-chart
k-title="{ text: 'DemoProg', position: 'bottom' }"
k-series-defaults="{ type: 'pie' }"
k-series="[{
field: 'solar',
categoryField: 'year',
padding: 0
}]"
k-data-source="yearSource"
k-series-hover="onSeriesHover"
></div>
而且我还在官方教程页面中发现,我们可以通过将其可见性设置为 true 来显示工具提示,但它位于 jQuery.
tooltip: {
visible: true,
format: "{0}%"
}
我的问题是如何在 angularjs 中显示工具提示?
任何帮助,将不胜感激。谢谢。
只需添加 k-tooltip
属性:
<div kendo-chart
k-title="{ text: 'DemoProg', position: 'bottom' }"
k-series-defaults="{ type: 'pie' }"
k-series="[{
field: 'solar',
categoryField: 'year',
padding: 0
}]"
k-data-source="yearSource"
k-series-hover="onSeriesHover"
k-tooltip="{visible: true, format: '{0}%'}">
</div>
我写了一个简单的 kendo-ui 应用程序,它显示来自 JSON 的饼图。我使用了 AngularJS,但找不到有关当用户将鼠标悬停在图表上时如何显示工具提示的参考。
编码片段:
<div kendo-chart
k-title="{ text: 'DemoProg', position: 'bottom' }"
k-series-defaults="{ type: 'pie' }"
k-series="[{
field: 'solar',
categoryField: 'year',
padding: 0
}]"
k-data-source="yearSource"
k-series-hover="onSeriesHover"
></div>
而且我还在官方教程页面中发现,我们可以通过将其可见性设置为 true 来显示工具提示,但它位于 jQuery.
tooltip: {
visible: true,
format: "{0}%"
}
我的问题是如何在 angularjs 中显示工具提示? 任何帮助,将不胜感激。谢谢。
只需添加 k-tooltip
属性:
<div kendo-chart
k-title="{ text: 'DemoProg', position: 'bottom' }"
k-series-defaults="{ type: 'pie' }"
k-series="[{
field: 'solar',
categoryField: 'year',
padding: 0
}]"
k-data-source="yearSource"
k-series-hover="onSeriesHover"
k-tooltip="{visible: true, format: '{0}%'}">
</div>