html背景图像重复怎么办,HTML5画布背景图像重复(HTML5 canvas background image repeat

我有一个HTML5画布绘制的声波。 我已经设置为背景图片，不过，我想这样的背景图像重复背景。 谁能告诉我，我会怎么做，什么我需要添加到我的代码：

var backgroundImage = new Image();

backgroundImage.src = 'http://www.samskirrow.com/client-kyra/images/main-bg.jpg';

var canvas;

var context;

function init(c) {

canvas = document.getElementById(c);

context = canvas.getContext("2d");

soundManager.onready(function() {

initSound(clientID, playlistUrl);

});

aniloop();

}

function aniloop() {

requestAnimFrame(aniloop);

drawWave();

}

function drawWave() {

var step = 10;

var scale = 60;

// clear

context.drawImage(backgroundImage, 0, 0);

// left wave

context.beginPath();

context.moveTo(0, 256);

for ( var i = 0; i < 256; i++) {

context.lineTo(6 * i, 257 + waveLeft[i] * 80.);

}

context.lineWidth = 1;

context.strokeStyle = "#000";

context.stroke();

// right wave

context.beginPath();

context.moveTo(0, 256);

for ( var i = 0; i < 256; i++) {

context.lineTo(6 * i, 256 + waveRight[i] * 80.);

}

context.lineWidth = 1;

context.strokeStyle = "#000";

context.stroke();

}

function updateWave(sound) {

waveLeft = sound.waveformData.left;

}

return {

init : init

};

})();

：你可以在这里看到此代码的http://www.samskirrow.com/client-kyra