KineticJS - 任何重复图像的方法？

Question

我已经切换到kineticJS,我正在尝试重复自己的背景图像.这是我正在使用的代码:

var background_image = new Image();
background_image.onload = function() {
    var image = new Kinetic.Image({
        image: background_image,
        width: this.width,
        height: this.height
    });
    mainLayer.add(image);
    stage.add(mainLayer); // now mainLayer is available
};

现在我想要做的就是本教程的作用: http://www.html5canvastutorials.com/tutorials/html5-canvas-patterns-tutorial/:

该教程使用canvas/context对象重复图像.我在文档中找不到图像重复,所以我想知道是否可以访问我的舞台(或图层？)的主要上下文元素,然后使用与教程类似的内容.

Answer 1

尝试使用带图像填充的Rect.默认情况下会重复图像填充.这是一个例子:

http://www.html5canvastutorials.com/kineticjs/html5-canvas-set-fill-with-kineticjs/

您还可以更改图案重复类型,使用偏移以及缩放图案图像

干杯!