在Paper JS中检测重叠对象

时间:2019-03-15 13:05:17

标签: paperjs

画布上有一个矩形和几个圆。散落。 矩形顶部的圆必须具有不同的颜色。

圆必须完全在矩形内。

如何在Paper JS中检测到这一点。

1 个答案:

答案 0 :(得分:3)

方法item.isInside(rectangle)似乎完全符合您的需求。

这里是sketch演示解决方案。

// create 3 circles scattered on the canvas.
var circles = [
    new Path.Circle({
        center: view.center - 100,
        radius: 50,
        fillColor: 'orange'
    }),
    new Path.Circle({
        center: view.center,
        radius: 50,
        fillColor: 'orange'
    }),
    new Path.Circle({
        center: view.center + 150,
        radius: 50,
        fillColor: 'orange'
    })
];

// Create a rectangle.
var rectangle = new Path.Rectangle({
    from: view.center - 80,
    to: view.center + 80,
    strokeColor: 'black'
});

// Scale things up so that we can see better.
project.activeLayer.fitBounds(view.bounds.scale(0.8));

// For each circle...
circles.forEach(circle => {
    // ...if circle is contained in rectangle bounds...
    if (circle.isInside(rectangle.bounds)) {
        // ...change circle color.
        circle.fillColor = 'blue';
    }
});