Question

第一次尝试paper.js，处理一些生成视觉效果。试图找出实现以下目标的最佳途径：

每个云的形状都是独立的，但当它们相互交叉时，我希望它们复合成一个更大的云。
在更大的云中，我希望单个形状保留其属性，以便它最终可以分离并再次成为单个云。

所以我遇到了一些试图完成此事的问题。我检查了十字路口：

//cloudArray refers to an array of path items
Cloud.prototype.checkIntersection = function() {

    //loop through all existing cloud shapes
    for(var i=0;i<cloudArray.length;i++){ 

        //avoid checking for intersections on the same cloud path
        if(this.path !== cloudArray[i].path){

            //if path intersects another, group the two, and
            //sort them in the order of their id
            if(this.path.intersects(cloudArray[i].path)){
                tmpGrp = [this.path,cloudArray[i].path];
                tmpGrp.sort(function(a,b){return a.id - b.id});
                groupClouds(tmpGrp);
            }
        }
    }
}

现在检查交叉点后，我尝试将云组合成数组：

function groupClouds(tmpGrp){
    if(grps.length > 0){
        for(var i=0;i<grps.length;i++){
            if(tmpGrp !== grps[i]){
                console.log('doesnt match');
                grps.push(tmpGrp);
            }else{
                console.log('matches');
            }
        }
    }else{
        grps[0] = tmpGrp;
    }
    console.log(grps);
}

现在我知道我无法通过这种方式比较数组，因此我尝试使用here给出的解决方案，但我不想进一步混淆这个问题。

这种方法合理吗？我知道如果我可以为每个组创建数组，我可以创建一个新的compoundPath。问题在于确保交叉云的每个集合都是正确的，并且它们正在高效更新。

有什么建议吗？

在paper.js中分组形状

0 个答案: