amCharts 4：仅在截断（带省略号）值上显示图例工具提示

Question

我已经使用以下代码在 amCharts v4 图表上启用了图例，但我有 省略号问题:

// Add legend
chart.legend = new am4charts.Legend();
chart.legend.fontSize = 11;

// Truncate long labels (more than 160px)
chart.legend.labels.template.maxWidth = 160;
chart.legend.labels.template.truncate = true;
chart.legend.labels.template.fullWords = true;

// Set custom ellipsis as default one is not displayed correctly
chart.legend.labels.template.ellipsis = "...";

// Set tooltip content to name field
chart.legend.itemContainers.template.tooltipText = "{name}";

如您所见，我必须设置一个自定义 省略号 属性因为 Firefox v76 显示 €|而不是截断的图例标签上的 …。它甚至发生在 sample on the amChart website 上，但令人惊讶的是，如果我在私人选项卡中打开相同的 URL 则不会...我该如何解决？

然后我想在图例上显示工具提示仅适用于截断的标签。添加适配器：

chart.legend.itemContainers.template.adapter.add("tooltipText", function(text, target) {
     // 'text' here contains the non-truncated string
    return "My modified " + text;
})

当然可以，但是如果我正在处理的标签被截断并清除 text 变量，我如何在适配器代码中识别？为未截断的图例项显示工具提示没有意义。

Answer 1

不确定最理想的方式但是...

您在适配器回调中获得了文本。您可以添加 text.length 检查，例如：

chart.legend.itemContainers.template.adapter.add("tooltipText", function(text, target) {
     // 'text' here contains the non-truncated string

    return text.length > someValyeBasedOnMaxwidth> ? "My modified " + text: "";
})

Answer 2

我找到了关于 tooltip 适配器的答案；这有效：

chart.legend.itemContainers.template.adapter.add("tooltipText", function(text, target) {
     if (!target.dataItem.label.isOversized) {
          // Legend label is NOT truncated, disable the tooltip
          return "";
     }

     // Legend label is truncated, display the tooltip
     return text;
})

我仍然不知道为什么省略号在没有设置属性...

的情况下不能正确显示

amCharts 4：仅在截断（带省略号）值上显示图例工具提示

amCharts 4: display legend tooltip on truncated (with ellipsis) values only

truncate

legend

tooltip

amcharts4