如何在 Paper.js 中相对于父组定位项目?
How to position an item relative to parent Group in Paper.js?
就像我们在 CSS 中做的 position: relative;
一样,我需要相对于父项 Group
定位任何新创建的项目。这是我期望得到的:
...使用以下代码:
var path = new Path([50, 0], [50, 100]);
var path2 = new Path([0, 50], [100, 50]);
// cross center at [50, 50]
var center = [100, 100]
var group = new Group({
children: [path, path2],
strokeColor: 'black'
});
// It's important to arrange the position
// right after creating the group
group.translate([50, 50])
new Path.Circle({
center: center,
radius: 5,
fillColor: 'red'
})
new Path.Rectangle({
from: [10, 10],
to: [40, 40],
strokeColor: 'black',
parent: group
})
不过,what I actually get is如下:
如何使新创建的项目相对于其父组定位?
Note: In order to take the "desired" screenshot, I needed to .translate()
the group
after inserting the rectangle: Sketch
原来是由applyMatrix: false
参数控制的:Sketch
var group = new Group({
children: [path, path2],
strokeColor: 'black',
applyMatrix: false,
});
group.translate([50, 50])
就像我们在 CSS 中做的 position: relative;
一样,我需要相对于父项 Group
定位任何新创建的项目。这是我期望得到的:
...使用以下代码:
var path = new Path([50, 0], [50, 100]);
var path2 = new Path([0, 50], [100, 50]);
// cross center at [50, 50]
var center = [100, 100]
var group = new Group({
children: [path, path2],
strokeColor: 'black'
});
// It's important to arrange the position
// right after creating the group
group.translate([50, 50])
new Path.Circle({
center: center,
radius: 5,
fillColor: 'red'
})
new Path.Rectangle({
from: [10, 10],
to: [40, 40],
strokeColor: 'black',
parent: group
})
不过,what I actually get is如下:
如何使新创建的项目相对于其父组定位?
Note: In order to take the "desired" screenshot, I needed to
.translate()
thegroup
after inserting the rectangle: Sketch
原来是由applyMatrix: false
参数控制的:Sketch
var group = new Group({
children: [path, path2],
strokeColor: 'black',
applyMatrix: false,
});
group.translate([50, 50])