AntV的花瓣图中鼠标悬浮提示信息去掉与修改
生活随笔
收集整理的這篇文章主要介紹了
AntV的花瓣图中鼠标悬浮提示信息去掉与修改
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
場景
SpringBoot+AntV實現餅狀圖中的花瓣圖:
https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/92810169
在實現上面的效果時,參照官方花瓣圖的示例代碼,總是在鼠標懸浮時提示一個信息1。
實現
怎樣將這個多余的提示去掉。
這是懸浮提示的標題title屬性。
參考官方文檔:
showTitle:boolean 是否展示提示信息的標題,默認為 true,即展示,通過設置為 false 來隱藏標題。title:string 設置 tooltip 的標題展示的數據字段,設置該字段后,該標題即會展示該字段對應的數值。showTitle 為false 時,該設置不生效。所以我們可以在js中進行設置,將其關閉title不顯示或者保留title但是修改為其他內容。
chart.tooltip({showTitle: false,itemTpl: '<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{type}({value}): {percent}</li>'});去掉之后的效果
總結
以上是生活随笔為你收集整理的AntV的花瓣图中鼠标悬浮提示信息去掉与修改的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: SpringBoot+AntV实现饼状图
- 下一篇: AntV中的饼状图中的花瓣图中的Tool