Paper.js - 剪切区域外路径的不透明度

Question

我有一个简单的矩形，可以为添加到画布的所有形状形成剪裁区域，效果很好：

var area = new paper.Rectangle(
    100, 100, 300, 120
);

var path = new paper.Path.Rectangle(area);

group.addChild(path);
group.clipped = true;

我想要实现的目标不是隐藏在该区域之外的路径，而是显示出轻微的不透明度，例如：

提前感谢您的任何帮助和建议。

Answer 1

这不是剪裁的简单方法，您可以通过使用方法相交来实现。 请尝试此代码。

// SET INITIAL
var area = new paper.Path.Rectangle(100, 100, 300, 220);
area.fillColor = 'yellow'
area.opacity = 0.2
var circle1 = new paper.Path.Circle({
    center:[150, 150],
    radius: 100,
    fillColor: 'red'
})

// OPACITY CLIPPING
var circle2 = circle1.intersect(area)
circle1.opacity = 0.2