Question

我是否有可能在画布上绘制图像？特别是使用fabric.js或literallycanvas.js？非常感谢任何信息或例子，ty

Answer 1

图层是软件抽象。它们定义按特定顺序（分层）处理的项目组。

任何东西都可以分层，因此在画布上绘制很容易制作图层。将每个图层中的所有对象组合在一起。然后按照图层定义的顺序将每个图层中的所有对象一起渲染。

一个非常简单的图层示例

var layers = [];  // holds layers
function addLayer(order){ /// creates and adds a layer
    var l;
    layers.push(l = {
        order : order,
        items : [],
        render : function(){
           this.items.forEach(function(img){
               ctx.drawImage(img.bitmap,img.x,img.y);
          });
    });
    return l;

}
// some items for the layers
var img1 = {
    bitmap : new Image("URL"),
    x : 100,
    y : 200,
}
var img2 = {
    bitmap : new Image("URL"),
    x : 300,
    y : 200,
}
// create a layer order 1
var lay1 = AddLayer(1);
// add some items to lay1
lay1.items.push(img1);
lay1.items.push(img2);
// add a second layer order 0
var lay2 = AddLayer(0);
lay1.items.push(img3);
lay1.items.push(img4);


// sort layers by order
layers.sort(function(a,b){return a.order-b.order;});
// process each layer in the sorted order
layers.forEach(function(layer){
    layer.render();
});

javascript - 用图层绘制图像

1 个答案: