antvis/G2

【v5】tooltip share 打开,有时会不共享 #5543

Deathsteps posted onGitHub

问题描述

应该和热区有关(截图看不到光标位置,可自行尝试)

边上一点,就只有柱子的数据 <img width="1140" alt="image" src="https://github.com/antvis/G2/assets/1549118/c8a365a8-77fd-4aad-af0d-330f5741e532">

中间一点,才能有线的数据 <img width="1102" alt="image" src="https://github.com/antvis/G2/assets/1549118/498e012b-37c3-4f00-a613-096712e4f49a">

期望结果

不管鼠标 hover 在图形何处都应该保持工具提示数据共享

如何重现

官方代码修改

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

const data = [
  { time: '10:10', call: 4, waiting: 2, people: 2 },
  { time: '10:15', call: 2, waiting: 6, people: 3 },
  { time: '10:20', call: 13, waiting: 2, people: 5 },
  { time: '10:25', call: 9, waiting: 9, people: 1 },
  { time: '10:30', call: 5, waiting: 2, people: 3 },
  { time: '10:35', call: 8, waiting: 2, people: 1 },
  { time: '10:40', call: 13, waiting: 1, people: 2 },
];

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

chart.data(data);

chart
  .interval()
  .encode('x', 'time')
  .encode('y', 'waiting')
  .axis('y', { title: 'Waiting', titleFill: '#5B8FF9' });

chart
  .line()
  .encode('x', 'time')
  .encode('y', 'people')
  .encode('shape', 'smooth')
  .style('stroke', '#fdae6b')
  .style('lineWidth', 2)
  .scale('y', { independent: true })
  .axis('y', {
    position: 'right',
    grid: null,
    title: 'People',
    titleFill: '#fdae6b',
  });

chart.interaction('tooltip', { "shared": true });

chart.render();

额外信息

  • G2 5.1.2 版本

鼠标不在折线图绘制区域内不会拾取

posted by pearmini over 1 year ago

我理解打开 share,应该同 X 轴共享 Tooltip 吧,不然一会儿显示 A,一会儿显示 AB,很奇怪,真的有人这么用图吗?

posted by Deathsteps over 1 year ago

share 这配置我看看

posted by pearmini over 1 year ago

看了一下这和 share 没有关系,share 不使用于种 tooltip,这个 https://github.com/antvis/G2/pull/5564 添加了一个 closest 配置解决这个问题。

posted by pearmini over 1 year ago

看了一下这和 share 没有关系,share 不使用于种 tooltip,这个 #5564 添加了一个 closest 配置解决这个问题。

经过讨论,这个配置可以去掉。

posted by pearmini over 1 year ago

@pearmini 柱状和散点和折线组合,坐标轴不共享的问题

posted by Calmio-Y over 1 year ago

@pearmini 没在文档中看到closest 这个配置呢。

posted by huangyuan7 11 months ago

@huangyuan7 这个配置已经去掉了哈

posted by pearmini 11 months ago

@pearmini 大佬大佬~,那v5版本还能实现这种效果吗 image

这种鼠标悬停在同一X轴位置上,但是不是在柱状图上,而在空白处。但是依然有tooltip效果。(ps: 图片效果是v4版本,加了tooltip:{shared:true}, 我在v5上试shared属性好像没效果😭😭😭😭😭)

posted by huangyuan7 11 months ago

@huangyuan7 会解决这个问题,可以看这个 issue:https://github.com/antvis/G2/issues/6257

posted by pearmini 11 months ago

Fund this Issue

$0.00
Funded

Pull requests