tooltip自定义render的问题：两个mark分别设置render，后一个覆盖了前一个

[ChristmasFox]

如图，怎么才能让两个mark自己设置自己的render

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

const chart = new Chart({
  container: 'container',
  theme: 'classic',
  theme: 'classic',
});

chart
  .point()
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/bmw-prod/fb9db6b7-23a5-4c23-bbef-c54a55fee580.csv',
  })
  .transform([{ type: 'sortX', by: 'y', reverse: true, slice: 5 }])
  .encode('x', 'letter')
  .encode('y', 'frequency')
  .interaction('tooltip', {
    // render 回调方法返回一个innerHTML 或者 ReactNode
    render: (event, { title, items }) =>
      `<div>Your custom render content here.</div>`,
  });

chart
  .interval()
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/bmw-prod/fb9db6b7-23a5-4c23-bbef-c54a55fee580.csv',
  })
  .transform([{ type: 'sortX', by: 'y', reverse: true, slice: 5 }])
  .encode('x', 'letter')
  .encode('y', 'frequency')
  .interaction('tooltip', {
    // render 回调方法返回一个innerHTML 或者 ReactNode
    render: (event, { title, items }) =>
      `<div>第二个interaction.</div>`,
  });


chart.render();

[pearmini]

一个 view 只能有一份 tooltip 配置，所以上面的写法本来就要被合并。如果希望不同的 mark 渲染不同的 tooltip，可以通过 render 里面的 event 参数里面的 target 判断是哪个 mark，然后返回对应的渲染结果。

[ChristmasFox]

好的谢谢🙏