Skip to content

🐞增加transform后图形变换拖拽乱套问题 #5060

@dinghaining

Description

@dinghaining

问题描述

translate(200px,60px),scale(-1,-1),这是我用的图形翻转,我发现翻转后,拖拽图形大小也会跑偏,并且框选图形和本身图形也分离了

重现链接

https://codesandbox.io/p/devbox/intelligent-cache-ppyqkd?workspaceId=ws_WRxsZYsZhq9L1rXhrGaoP

重现步骤

import { Graph, Transform } from '@antv/x6'
Graph.registerNode(
'custom-node',
{
width: 200,
height: 60,
attrs: {
body: {
stroke: '#5F95FF',
strokeWidth: 1,
fill: 'rgba(95,149,255,0.05)',
refWidth: 1,
refHeight: 1,
},
text: {
text: 'this is content text',
refX: 40,
refY: 38,
fontSize: 12,
fill: 'rgba(255,72,77,.6)',
'text-anchor': 'start',
},
},
markup: [
{
tagName: 'rect',
selector: 'body',
},
{
tagName: 'text',
selector: 'text',
},
],
},
true,
)

const graph = new Graph({
container: document.getElementById('container')!,
grid: true,
})
graph.use(
new Transform({
resizing: {enabled: true,
minWidth: 1,
maxWidth: 200,
minHeight: 1,
maxHeight: 150,
orthogonal: false,
restrict: false,
preserveAspectRatio: false,},
}),
)
let node = graph.addNode({
x: 200,
y: 160,
shape: 'custom-node',
})
node.attr(body/transform,'translate(200px,60px),scale(-1,-1)')
如果链接不行请使用这个,完整且可复现

预期行为

增加translate(200px,60px),scale(-1,-1)后可以继续图形变换

平台

谷歌浏览器,x6 3.x版本

屏幕截图或视频(可选但最好有)

No response

补充说明(可选)

Metadata

Metadata

Assignees

No one assigned

    Labels

    waiting for maintainerTriage or intervention needed from a maintainer

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions