【问题标题】：Chartjs - Tooltip with Rupee SymbolChartjs - 带有卢比符号的工具提示
【发布时间】：2026-01-16 17:15:02
【问题描述】：

我正在为我的图表使用工具提示，如下所示：-

var opt = {
                  ....
                  animation: true,
                  animationSteps: 100,                   
                  tooltipTemplate: function (tooltip) {
                       return numConversion(tooltip.value);
                  }
           }

function numConversion(val) {
    if (val >= 10000000) val = (val / 10000000).toFixed(2) + ' Cr';
    else if (val >= 100000) val = (val / 100000).toFixed(2) + ' Lac';
    else if (val >= 1000) val = (val / 1000).toFixed(2) + ' K';
    return val;

}

我想要一个卢比符号来添加文本。当我在工具提示中使用一些 html 标签时，标签会按原样显示。

return "<i class='fa fa-inr'></i>" + numConversion(tooltip.value);

上面的行以文本格式显示标签。如何在工具提示中显示实际的标签？

【问题讨论】：

您需要创建自定义工具提示。chart.js 将无法识别工具提示中的 html，除非您为此创建单独的 html 模板并将其分配给自定义工具提示。看看这个*.com/questions/30500601/… 和这个jsfiddle.net/6rxdo0c0/1。
我已经尝试过customTooltips。 tooltip 中的值来自false。
您能否使用自定义工具提示分享您在 JsFiddle 中的代码。
自定义工具提示对我有用。我忘记包含 <div>for 工具提示。

标签： javascript jquery html chart.js

【解决方案1】：

在工具提示中使用 Font Awesome 图标

只需设置tooltipFontFamily

请注意，您实际上并没有将 HTML 放入画布工具提示中。您只是将整个工具提示的字体设置为 FontAwesome。副作用是您的数字也将采用 FontAwesome 字体 - 这通常是可以的。如果这不行，自定义工具提示将是可行的方法（正如 @J-D 和 @Lalji Tadhani 已经指出的那样）

您还需要稍等片刻才能加载字体文件（我相信即使您使用自定义工具提示也会遇到这个问题）

预览

脚本

...
var myNewChart = new Chart(ctx).Line(lineData, {
    tooltipFontFamily: "'FontAwesome'",
    tooltipTemplate: function (tooltip) {
        return "\uf156 " + numConversion(tooltip.value);
    }
});
...

CSS

注意源的占位符

@font-face {
    font-family: 'FontAwesome';
    src: /* path to your font files */
    font-weight: normal;
    font-style: normal;
}

小提琴 - https://jsfiddle.net/akypsz26/

【讨论】：

除了 fontawesome 之外还有什么方法...比如使用&#x20B9(₹)。因为不必要的应用程序必须依赖于 font awesome 的网站或者下载它。
哦，是的，如果您不想使用 fontawesome 符号，请使用 return "\u20B9 " + numConversion(tooltip.value);。顺便说一句，你可能想检查你的目标机器是否没有把它变成盒子（我不知道是什么让它变成盒子:-)）

【解决方案2】：

将属性data-html="true" 添加到您的链接

HTML-tags in tooltip

【讨论】：

工具提示出现在折线图点的悬停上。这里没有链接。我正在使用chartjs。