5纬雷达图显示问题 #6473

问题描述

<img width="1230" alt="image" src="https://github.com/user-attachments/assets/a916044f-d409-4ba0-9f31-540af5f681e2"> 代码 import { Chart } from '@antv/g2';

const data = [ { item: 'Design', type: 'a', score: 70 }, { item: 'Design', type: 'b', score: 30 }, { item: 'Development', type: 'a', score: 60 }, { item: 'Development', type: 'b', score: 70 }, { item: 'Marketing', type: 'a', score: 50 }, { item: 'Marketing', type: 'b', score: 60 }, { item: 'Users', type: 'a', score: 40 }, { item: 'Users', type: 'b', score: 50 }, { item: 'Test', type: 'a', score: 60 }, { item: 'Test', type: 'b', score: 70 }, ];

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

chart.coordinate({ type: 'polar' });

chart .data(data) .scale('x', { padding: 0.5, align: 0 }) .scale('y', { tickCount: 5 }) .axis('x', { grid: true }) .axis('y', { zIndex: 1, title: false });

chart .area() .encode('x', 'item') .encode('y', 'score') .encode('color', 'type') .encode('shape', 'smooth') .style('fillOpacity', 0.1) .scale('y', { domainMax: 80 });

chart .line() .encode('x', 'item') .encode('y', 'score') .encode('color', 'type') .encode('shape', 'smooth') .style('lineWidth', 2);

chart.interaction('tooltip', { crosshairsLineDash: [4, 4] });

chart.render();

重现链接

https://g2.antv.antgroup.com/examples/general/radar/#grid-radial

重现步骤

进入官网，复制粘贴 5纬度的雷达图有多余的线

预期行为

没有多余的线

平台

• 操作系统: [macOS, Windows, Linux, React Native ...]
• 网页浏览器: [Google Chrome, Safari, Firefox]

屏幕截图或视频（可选）

No response

补充说明（可选）

No response