How to set dynamic content to a tooltip?

▼魔方 西西 提交于 2019-12-12 03:54:34

问题


I need to make a call to an api to return the tooltip content. Does anyone know, when setting a tooltip, how to acess the arguments in the dataItem, pass them to a function which returns the tooltip content?

I've seen this and this example but I'cant understand how to do this.


回答1:


The chart provides tooltip templates, as shown in the chart tooltip online demos. These allow custom tooltips to be created:

<kendo-chart-tooltip>
  <template kendoSeriesTooltipTemplate let-value="value">
      Default Content {{ value }}
  </template>
</kendo-chart-tooltip>

You can use pipes on the value to process it, or render a custom component. Each series can have its custom tooltips, if needed:

<kendo-chart-series-item>
  <kendo-chart-series-item-tooltip>
    <template let-value="value">
       Series 1 value: {{ value }}
    </template>
  </kendo-chart-series-item-tooltip>
</kendo-chart-series-item>

To make an API call, create a component that makes the request (and probably caches it) and use it in the tooltip template:

<kendo-chart-tooltip>
  <template kendoSeriesTooltipTemplate let-value="value">
     <my-series-details-tooltip [value]="value"></my-series-details-tooltip>
  </template>
</kendo-chart-tooltip>

Here is a plunker demo that shows this.



来源:https://stackoverflow.com/questions/40788626/how-to-set-dynamic-content-to-a-tooltip

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!