<body>
<canvas id="c1" width="400" height="400">
</canvas>
<script type="text/javascript">
var oC = document.getElementById("c1");
var oGC = oC.getContext("2d");
var img = new Image();
img.onload = function () {
draw(this);
}
img.src = '3.png';
function draw(obj) {
var bg = oGC.createPattern(obj,'repeat');
oGC.fillStyle = bg;
oGC.fillRect(0, 0, 300, 300);
}
</script>
</body>