如何在 Chart Js 中自定义工具提示？

Posted 2023-05-07

技术标签:

【中文标题】如何在 Chart Js 中自定义工具提示？【英文标题】：how to customize tooltip in Chart Js? 【发布时间】：2022-01-01 03:34:47 【问题描述】：

我想自定义图表js上的tooltip的标签。我只想用粗体显示投资组合的价值 (+2,5%)。

I found this example:
https://jsfiddle.net/nosensus/hhcyhjf9/

当我应用它时，我的工具提示总是在左下角，而不是在图表上。如何解决？我正在使用 Chart.js 2.9.4 版本并使用 Angular 进行开发。

tooltip of the chart should be like this

【问题讨论】：

【参考方案1】：

将您想要加粗的文本放在这些标签之间： <strong>...</strong>

如下：

tooltip: 
  trigger: 'item',
  formatter: '<strong>a</strong> <br/> b:c'
,

example

【讨论】：

以上是关于如何在 Chart Js 中自定义工具提示？的主要内容，如果未能解决你的问题，请参考以下文章