期望annotation能够支持新的参数，满足在某些场景下根据当前view状态决定显示隐藏的功能

[KedAyAyA]

• I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://codepen.io/KedAyAyA/pen/ExNrJyX?editors=0010

Steps to reproduce

1. 点击London的图例
2. 绿色线隐藏，但是标注信息仍然存在

期望可以隐藏针对该 图元 生成的对应London趋势线以及对该条线上某一点的标注

Environment	Info
g2	4.1.12
System	mac
Browser	any

---

从技术及图表层设计上看，geom与annotation确实没有任何关系，并且annotation支持的参数其实是用来确定在图上位置的，与是否隐藏线并没有任何关系。

这种需求一般是从业务角度出发的，我们使用图例对某个维度进行筛选后，自然也期望我们从业务关联的所有annotation组件一并取消显示，否则其实会带来展示上的误区。

目前来看没有很好的办法能够有效的支撑这类需求，但有两个大概的思路

1. 监听legend的click回调，然后结合业务场景找到对应的annotation compont，去hide掉。但其实也涉及了较多底层逻辑，不看源码基本无法实现
2. 增加一个实时回调参数，可以在annotation决定创建 or 渲染的时候，根据当时的view层状态进行判断(filteredData看过滤掉了哪些数据)再决定显示隐藏。

两个想法不知道与整个技术设计方案是否有些冲突

[hustcc]

合理的方案，还是 1，但是目前来做比较蹩脚，原因是没有办法拿到当前哪些 legend 选中了。如果是方案 2 使用上是比较方便了，但是感觉确实设计上有一些违背了。

在 5.0 中会强化 1 的方案，而不会保留方案 2.

[KedAyAyA]

是的，而且方案1在查找 对应annotation component的时候 和 hide的时候都需要对底层有一定的了解，成本还是比较高的。

方案2确实比较方便了，而且可能不仅仅针对这个case，任意update的时候都可以按照当前view的状态判断，是否可以考虑先支持一下呢?

[pearmini]

G2 5.0 可以解决这个问题，给 text mark 加上 color encode 即可：

import { Chart } from '@antv/g2';

const chart = new Chart({
  container: 'container',
  autoFit: true,
});

chart.options({
  type: 'view',
  data: [
    { month: 'Jan', city: 'Tokyo', temperature: 7 },
    { month: 'Jan', city: 'London', temperature: 3.9 },
    { month: 'Feb', city: 'Tokyo', temperature: 6.9 },
    { month: 'Feb', city: 'London', temperature: 4.2 },
    { month: 'Mar', city: 'Tokyo', temperature: 9.5 },
    { month: 'Mar', city: 'London', temperature: 5.7 },
    { month: 'Apr', city: 'Tokyo', temperature: 14.5 },
    { month: 'Apr', city: 'London', temperature: 8.5 },
    { month: 'May', city: 'Tokyo', temperature: 18.4 },
    { month: 'May', city: 'London', temperature: 11.9 },
    { month: 'Jun', city: 'Tokyo', temperature: 21.5 },
    { month: 'Jun', city: 'London', temperature: 15.2 },
    { month: 'Jul', city: 'Tokyo', temperature: 25.2 },
    { month: 'Jul', city: 'London', temperature: 17 },
    { month: 'Aug', city: 'Tokyo', temperature: 26.5 },
    { month: 'Aug', city: 'London', temperature: 16.6 },
    { month: 'Sep', city: 'Tokyo', temperature: 23.3 },
    { month: 'Sep', city: 'London', temperature: 14.2 },
    { month: 'Oct', city: 'Tokyo', temperature: 18.3 },
    { month: 'Oct', city: 'London', temperature: 10.3 },
    { month: 'Nov', city: 'Tokyo', temperature: 13.9 },
    { month: 'Nov', city: 'London', temperature: 6.6 },
    { month: 'Dec', city: 'Tokyo', temperature: 9.6 },
    { month: 'Dec', city: 'London', temperature: 4.8 },
  ],
  encode: {
    x: 'month',
    y: 'temperature',
    color: 'city',
  },
  children: [
    { type: 'line' },
    { type: 'point', style: { shape: 'point' } },
    {
      type: 'text',
      data: ['Jul', 17],
      encode: {
        text: '当前点London温度最高',
        color: 'London', // 加上 color encode
      },
      style: { fill: '#000' },
    },
  ],
});

chart.render();

不过有点小的 bug，可以更进这个 issue：#5506