feat: add tooltip data to tooltip event callback

[moayuisuda]

Checklist

• npm test passes
• benchmarks are included
• commit message follows commit guidelines
• documents are updated

Description of change

Before	After

[hustcc]

这个 data 是什么结构的，拍平了放里面会不会乱？

[moayuisuda]

返回的都是

{
  title: string,
  items: Record[]
}

这种结构，并且这个地方...解构的数据是放在上面的，不会影响现有数据

[hustcc]

@moayuisuda 单测已经修复：#6508 。可以重新 rebase 一下目标分支，在提交一下。

[coveralls]

Pull Request Test Coverage Report for Build 12196381001

Details

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 86.66%

---

Totals
Change from base Build 12194236144:	0.0%
Covered Lines:	10611
Relevant Lines:	11866

---

💛 - Coveralls

[hustcc]

@moayuisuda 可以麻烦写一下伪代码，如果有了这个之后，是怎么实现自己的业务逻辑的？

[moayuisuda]

@moayuisuda 可以麻烦写一下伪代码，如果有了这个之后，是怎么实现自己的业务逻辑的？

const Tooltip = forwardRef(({ data }, ref) => {
  const [lock, setLock] = useState(false);

  useImperativeHandle(ref, () => ({
    lock: () => setLock(true),
    unlock: () => setLock(false),
  }));

  return (
    <div className={classnames(lock && "lock")}>
      <h2>{data.title}</h2>
      <ul>
        {data.items.map((item) => (
          <Item data={item} />
        ))}
      </ul>
    </div>
  );
});

function renderTooltip(data, ref) {
  ReactDom.render(<Tooltip data={data} ref={ref} />, tooltipContainer);
}

function App() {
  const tooltipRef = useRef();

  useEffect(() => {
    plot.on("tooltip:show", (data) => renderTooltip(data, tooltipRef));
    plot.on("plot:click", tooltipRef.current.lock);
  });
}

[pearmini]

@moayuisuda 看你的例子是希望自定义 tooltip 的渲染内容？如果是这样的话可以通过如下 API 实现：

chart.interaction('tooltip', {
  render: (event, data) => {
    return ReactDom.render(<Tooltip data={data}>, tooltipContainer);
  },
});

参考这个例子。

[moayuisuda]

@pearmini 之前尝试过，但是这样写会有g2本来的tooltip。因为我们业务的tooltip有锁定，多选对比功能，现在是完全用react来重新实现的。当然如果g2原生能够支持tooltip点击锁定逻辑，我也就不用绕这么大的弯子了

[pearmini]

@hustcc 我记得你是添加了 tooltip 锁定的功能的？

[hustcc]

@hustcc 我记得你是添加了 tooltip 锁定的功能的？

内置只有 enterable 功能，没有业务中的锁定。

[hustcc]

data

之前的 data 是没有 title 和 items 是吧？