如何在 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])