Paper.js忽略图像选择

时间:2014-03-28 23:20:21

标签: javascript paperjs

我正在与Paper.js合作,并且我正在尝试构建 "选择 - 通过交叉"

阐述我的意思是用户绘制选择矩形并且选择了与选择矩形中任何一个点相交的项目。

现在路径项都很好,但是光栅图像会带来问题:

他们是否可以忽略选择中的光栅图像或使其以某种方式使用光栅(如果是的话我会很感激一个简单的答案,否则我不会能够实现它,业余和所有)。

使用我当前的代码Chrome返回:未捕获的TypeError:无法读取属性'长度'未定义的

到目前为止这是代码:

// Returns path points which are contained in the rect. 
function getSegmentsInRect(rect) {
    var segments = [];

    function checkPathItem(item) {
        if (item._locked || !item._visible || item._guide)
            return;
        var children = item.children;
        if (!rect.intersects(item.bounds))
            return;
        if (item instanceof paper.Path) {
            for (var i = 0; i < item.segments.length; i++) {
                if (rect.contains(item.segments[i].point))
                    segments.push(item.segments[i]);
            }
        } else {
            for (var j = children.length-1; j >= 0; j--)
                checkPathItem(children[j]);
        }
    }

    for (var i = paper.project.layers.length - 1; i >= 0; i--) {
        checkPathItem(paper.project.layers[i]);
    }

    return segments;
}

// Returns all items intersecting the rect.
// Note: only the item outlines are tested.
function getPathsIntersectingRect(rect) {
    var paths = [];
    var boundingRect = new paper.Path.Rectangle(rect);

    function checkPathItem(item) {
        var children = item.children;
        if (item.equals(boundingRect))
            return;
        if (!rect.intersects(item.bounds))
            return;
        if (item instanceof paper.PathItem) {
            if (rect.contains(item.bounds)) {
                paths.push(item);
                return;
            }
            var isects = boundingRect.getIntersections(item);
            if (isects.length > 0)
                paths.push(item);
        } else {
            for (var j = children.length-1; j >= 0; j--)
                checkPathItem(children[j]);
        }
    }

    for (var i = 0, l = paper.project.layers.length; i < l; i++) {
        var layer = paper.project.layers[i];
        checkPathItem(layer);
    }

    boundingRect.remove();

    return paths;
}

// Returns bounding box of all selected items.
function getSelectionBounds() {
    var bounds = null;
    var selected = paper.project.selectedItems;
    for (var i = 0; i < selected.length; i++) {
        if (bounds == null)
            bounds = selected[i].bounds.clone();
        else
            bounds = bounds.unite(selected[i].bounds);

这就是我定义Raster的方式

function placeImage() {

    var raster = new paper.Raster('mona');
    raster.addChild;
    raster.position = paper.view.center;
    raster.selected = true;
    raster.index = 0;

}

1 个答案:

答案 0 :(得分:1)

我们可以使用item.type来检查与选择矩形相交的项目是否是&#39;&#39;&#39;&#39;&#39; < / em>的。

我添加了一个额外的IF语句来实现这一点。

IF(item.type === "Raster"){
return;
}

这样就会忽略具有 Raster 类型的项目。

但是,如果有一种简单的方法可以使用选择矩形选择 Raster ,那么这将是一个更好的答案,尽管我建议的解决方案解决了这个问题

更新:Paper.js v0.9.17使用className代替类型来识别项目类型。

因此上述功能改为:

IF(item.className === "Raster"){
    return;
    }