代码之家 › 专栏 › 技术社区 › ceremcem

如何在Paper.js中的路径上创建孔?

paperjs

1

ceremcem · 技术社区 · 7 年前

我想得到这样的结果 this 而白色的圆圈实际上是一拳:

然而,我得到了 following result the boolean operation example :

// this works okay 
var via = outer.exclude(hole)
project.activeLayer.addChild(via)

// this works weird 
var drilledY = y.exclude(hole)
project.activeLayer.addChild(drilledY)

Path . 如何在路径中创建孔?

1 回复 | 直到 7 年前

1

nicholaswmin 7 年前

Path.Line .

Path 例如 路径.行 缺少。

所以你可以做以下几点:

把那些粗线条换成 Path.Rectangle
unite 路径 做手术。
subtract 而不是 exclude “打通”。

var x = new paper.Path.Rectangle({
    from: [100, 100],
    to: [120, 200],
    fillColor: 'red',
    strokeWidth: 1
});

var y = x.clone().rotate(90).set({ fillColor: 'blue' })

// Unite x/y to get a single path.
var cross = y.unite(x)

// Remove x,y we no longer need them, we got the cross.
x.remove()
y.remove()

var hole = new paper.Path.Circle({
    center:[110, 150],
    radius: 6,
    strokeColor: 'red',
    fillColor: 'red'
})

// Subtract (instead of exclude), to "punch through".
var drilled = cross.subtract(hole)

// Remove hole/cross, we no longer need them.
hole.remove()
cross.remove()

console.log(drilled)

这里有一个 Sketch .

团结 减去 从他们的洞,只记得使用封闭 s。