简体   繁体   English

在 amcharts5 上当值为零时隐藏工具提示

[英]Hide tooltip when value is zero on amcharts5

Trying to hide all the tooltips of an XY area chart when the value is 0.当值为 0 时,试图隐藏 XY 面积图的所有工具提示。

Have found a solution for amcharts4, but this is not possible for amcharts5.找到了 amcharts4 的解决方案,但这对 amcharts5 是不可能的。 The labelText key of the tooltip is a string and no function. tooltip的labelText键是一个字符串,没有function。

Solution for amcharts4: https://www.amcharts.com/docs/v4/tutorials/do-not-show-tooltip-for-zero-value-columns/ amcharts4的解决方案: https://www.amcharts.com/docs/v4/tutorials/do-not-show-tooltip-for-zero-value-columns/

function createSeries(field: string) {
 const series = chart.series.push(
        LineSeries.new(root, {
          name,
          xAxis,
          yAxis,
          valueXField: 'timestamp',
          valueYField: field,
          categoryXField: 'timestamp',
          legendValueText: '{valueY}',
          tooltip: Tooltip.new(root, {
            pointerOrientation: 'horizontal',
            labelText: // --> this needs to be a string
              '[bold]{name}[/]\n{timestamp.formatDate()}: {field} {valueY}',
          }),
        })
      );
}

for (const key of data.keys) {
  createSeries(key);
}

DEMO演示

CodeSandBox代码沙盒

在此处输入图像描述

You can also do this with amCharts 5 using an adapter .您也可以使用适配器对 amCharts 5 执行此操作。

The following code should be inside your createSeries() function, right after the series constant declaration and initialization:以下代码应该在您的createSeries() function 中,紧接在series常量声明和初始化之后:

series.get("tooltip").adapters.add("visible", (visible, target) => {
  return target.dataItem?.dataContext[field] > 0;
});

Adapters are custom functions that can be used to dynamically alter value of an element's setting.适配器是自定义函数,可用于动态更改元素设置的值。

Adapters – amCharts 5 Documentation适配器 – amCharts 5 文档

So here we put an adapter on the series tooltip to alter its visibility.所以在这里我们在系列工具提示上放置了一个适配器来改变它的可见性。 If target.dataItem exists, then we can test the value stored in dataContext for the given key.如果target.dataItem存在,那么我们可以为给定的键测试存储在dataContext中的值。 If this value is strictly positive, the Boolean expression is evaluated as true , which means that the tooltip will be visible.如果此值严格为正,则 Boolean 表达式的计算结果为true ,这意味着工具提示将可见。 Otherwise, the Boolean expression is evaluated as false and the tooltip will be hidden.否则,Boolean 表达式被评估为false ,工具提示将被隐藏。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM