html5背景重复,HTML5画布背景图片重复

我有一个绘制声波的

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);

// 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 + waveRight[i] * 80.);

}

context.lineWidth = 1;

context.strokeStyle = "#000";

context.stroke();

}

function updateWave(sound) {

waveLeft = sound.waveformData.left;

}

return {

init : init

};

})();