antvis/G6

The issue has been closed
Plug-in-Hull Node set outline wrapping, there are only 3 nodes and at a specific location, the outline is displayed abnormally #6520
endszh posted onGitHub
Describe the bug / 问题描述
Reproduction link / 重现链接
https://g6.antv.antgroup.com/zh/examples/plugin/hull/#basic
Steps to Reproduce the Bug or Issue / 重现步骤
1.设置如下坐标的3个节点,layout为none,轮廓显示异常 (Grid 网格布局,用轮廓包裹3个相邻的同一列的节点,有同样的显示异常)
import { Graph } from '@antv/g6';
fetch('https://assets.antv.antgroup.com/g6/collection.json')
.then((res) => res.json())
.then((data) => {
data = {
"nodes": [
{
"id": "node-0",
"data": {
"cluster": "a"
},
"style": {
x: 0,
y:0,
"size": 50
}
},
{
"id": "node-1",
"data": {
"cluster": "a"
},
"style": {
x: 0,
y:100,
"size": 30
}
},
{
"id": "node-4",
"data": {
"cluster": "a"
},
"style": {
x: 0,
y:200,
"size": 30
}
},
],
}
const groupedNodesByCluster = data.nodes.reduce((acc, node) => {
const cluster = node.data.cluster;
acc[cluster] ||= [];
acc[cluster].push(node.id);
return acc;
}, {});
const createStyle = (baseColor) => ({
fill: baseColor,
stroke: baseColor,
labelFill: '#fff',
labelPadding: 2,
labelBackgroundFill: baseColor,
labelBackgroundRadius: 5,
});
const graph = new Graph({
container: 'container',
data,
behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element'],
node: {
palette: { field: 'cluster' },
},
layout: {
// type: 'force',
// preventOverlap: true,
// linkDistance: (d) => {
// if (d.source === 'node0' || d.target === 'node0') {
// return 200;
// }
// return 80;
// },
},
plugins: [
{
key: 'hull-a',
type: 'hull',
members: groupedNodesByCluster['a'],
labelText: 'cluster-a',
...createStyle('#1783FF'),
},
{
key: 'hull-b',
type: 'hull',
members: groupedNodesByCluster['b'],
labelText: 'cluster-b',
...createStyle('#00C9C9'),
},
{
key: 'hull-c',
type: 'hull',
members: groupedNodesByCluster['c'],
labelText: 'cluster-c',
...createStyle('#F08F56'),
},
{
key: 'hull-d',
type: 'hull',
members: groupedNodesByCluster['d'],
labelText: 'cluster-d',
...createStyle('#D580FF'),
},
],
autoFit: 'center',
});
graph.render();
});
G6 Version / G6 版本
🆕 5.x
Operating System / 操作系统
Windows
Browser / 浏览器
Chrome, Edge
Additional context / 补充说明
No response