Question

我有一个小程序，其中一个函数正在用很少的随机点慢慢地绘制背景。唯一的问题是，在动画的早期，有很多符号对象代表这些点，它开始滞后。我通过让所有符号都基于相同的圆路径使其尽可能轻。当我改为使用新路径而不是将每个圆基于同一路径时，滞后开始得更早。

从使用普通的js画布，我记得当一个画了一个形状时，它会留在那里而不再打扰系统了，对吧？我试过把一个单独的画布放在后面（绝对定位），但是在调整大小时遇到了麻烦。我认为paper.js初始化螺丝具有两个画布的比例。

是否有可能以某种方式与常规画布JS一样绘制路径，然后让画布忘记它并将其留在后台？如果没有，有没有人有解决方法的想法？

由于

Answer 1

我会使用Group来包含您要生成的所有点。在每帧之后，将组与前一帧一起光栅化，然后调用group.remove()。例如：

var raster = new Raster();

function onFrame(event){
    var raster2;
    var group = new Group();

    // add the previous frame
    group.appendBottom(raster);

    var path;
    for(i = 0; i < 70; i++){
        path = new Path.Circle({
            center: view.size * Point.random(),
            radius: 20,
            fillColor: new Color(Math.random(), Math.random(), Math.random(), Math.random())
        });
        group.appendTop(path);
    }
    raster2 = group.rasterize();
    group.remove();
    raster = raster2;
}

Here it is on sketch.paperjs.org.

将paper.js路径保留为背景中不可交互的像素

1 个答案: