Chartjs 显示标签 &鼠标悬停时的单位统计

2022-01-22 00:00:00 label ruby-on-rails jquery javascript chart.js

是否可以有标签 &当我的鼠标指针悬停在图表上时的单位?目前只有数字.

Is it possible to have the label & units when my mouse pointer is hover the chart ? For now there is only the number.

对于下面的示例，我想展示:

For the example bellow I would like to show :

  • 58% 标签1
  • 0% 标签2
  • 0% 标签3
  • 0% 标签4
  • 0% 标签5

我的选项如下所示:

var options = {
      //Boolean - Show a backdrop to the scale label
      scaleShowLabelBackdrop : true,
      //Boolean - Whether to show labels on the scale
      scaleShowLabels : true,
      // Boolean - Whether the scale should begin at zero
      scaleBeginAtZero : true,
      scaleLabel : "<%%= Number(value) + ' %'%>",
      legendTemplate: "<ul class="<%%=name.toLowerCase()%>-legend"><%% for (var i=0; i<datasets.length; i++){%><li><span style="background-color:<%%=datasets[i].strokeColor%>"></span><%%if(datasets[i].label){%><%%=datasets[i].label%> <strong><%%=datasets[i].value%></strong><%%}%></li><%%}%></ul>",
      tooltipTemplate: "<%%= value %> Label"
    }

使用 scaleLabel 选项，我在 Y 轴上显示 %，但在悬停弹出窗口上没有显示...

With scaleLabel option I have the % shown on the Y-axis but not on the hover pop-up...

推荐答案

我找到了解决方案 在 Github 上的 ChartJS 存储库中.

解决方案是使用选项multiTooltipTemplate 如果您的图表有多个数据.否则，您应该使用 tooltipTemplate

The solution is to use the option multiTooltipTemplate if your graph has multiple data. Otherwise, you should use tooltipTemplate

multiTooltipTemplate: "<%=datasetLabel%> : <%= value %>"  // Regular use
// or
multiTooltipTemplate: "<%%=datasetLabel%> : <%%= value %>"  // Ruby on Rails use

会给你:

  • 数据集标签:值

相关文章