Skip to content

🐛 [BUG]饼图具有相同的 colorField 的数据,在启用 pie-legend-active 交互时会报 Cannot read properties of undefined (reading 'setMatrix') #3861

@SakuraRabbits

Description

@SakuraRabbits

🐛 Bug description [Please make everyone to understand it]

指定的 colorField 在 data 中有相同的值时,鼠标移入 legend 触发 pie-legend-active 交互则会报错
https://stackblitz.com/edit/vitejs-vite-tonau9rh?file=src%2FPieComponent.tsx

📷 Step to reproduce

import { useEffect, useRef } from 'react';
import { Pie } from '@antv/g2plot';

export default function PieComponent() {
  const ref = useRef<HTMLDivElement>(null);
  const pie = useRef<Pie>(null);

  useEffect(() => {
    const data = [
      { country: 'Asia', year: '1750', value: 502 },
      { country: 'Asia', year: '1800', value: 635 },
      { country: 'Europe', year: '1750', value: 163 },
      { country: 'Europe', year: '1800', value: 203 },
    ];
    if (ref.current) {
      const piePlot = new Pie(ref.current, {
        appendPadding: 10,
        data,
        angleField: 'value',
        colorField: 'country',
        radius: 0.8,
        label: {
          type: 'outer',
          content: '{name} {percentage}',
        },
        interactions: [
          { type: 'pie-legend-active' },
          { type: 'element-active' },
        ],
      });
      piePlot.render();
      pie.current = piePlot;
    }

    return () => {
      if (pie.current) {
        pie.current.destroy();
        pie.current = null;
      }
    };
  }, []);
  return <div ref={ref} />;
}

鼠标移入饼图的 legend 上会报 TypeError: Cannot read properties of undefined (reading 'setMatrix')

Image

同时 label 也没有内容

Image

🏞 Expected result

不报错且有正常显示的 label

🚑 Any additional [like screenshots]

  • G2Plot Version: 2.4.33
  • Platform: chrome

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions