amCharts 4:仅在截断的(带省略号)值上显示图例工具提示

问题描述 投票:0回答:1

我已经使用以下代码在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}";

如您所见,我必须设置custom 省略号

属性,因为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

变量,如何在适配器代码中标识呢?显示未截断的图例项目的工具提示没有任何意义。

我已使用以下代码在amCharts v4图表上启用图例,但省略号存在问题://添加图例chart.legend = new am4charts.Legend(); chart.legend.fontSize = 11; //截断...

tooltip legend truncate amcharts4
1个回答
0
投票

不确定最理想的方法,但是...

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

© www.soinside.com 2019 - 2024. All rights reserved.