Angular.js中的Kendo-ui工具提示 [英] Kendo-ui tooltip in Angularjs

问题描述

我编写了一个简单的kendo-ui应用程序，该应用程序显示了JSON的饼图.我使用AngularJS，当用户将鼠标悬停在图表上时，找不到如何显示工具提示的参考.

I wrote a simple kendo-ui app, which displays a pie chart from JSON. I used AngularJS and i couldn't find a reference on how to display a tooltip when the user hovers on the chart.

代码段:

<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中.

and i also found out in the official tutorial page, we can show the tooltip by setting it's visibility to true but it's in jQuery.

tooltip: {
                    visible: true,
                    format: "{0}%"
                }

我的问题是我们如何在angularjs中显示工具提示? 任何帮助，将不胜感激.谢谢.

My question is how can we show a tooltip in angularjs? Any help would be appreciated. Thank you.

推荐答案

只需添加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>

这篇关于Angular.js中的Kendo-ui工具提示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！