Notice: Undefined variable: this in /home/dimarini/public_html/libraries/src/Application/CMSApplication.php on line 441

Метод createPattern

Методът createPattern използва обект за създаването на модел, с който се запълва полето, определено от canvas. Този обект може да е изображение, видео, аудио или друг елемент. Този метод може да се използва за запълване на правоъгълник, окръжност, линии и др. По-долу е даден пример за запълване на правоъгълник.

<!DOCTYPE html>
<html>
<body>

     <p>Изображението:</p>
	<img src="http://dimarini.net/images/lessons/html5/dddd.png" id="ddddImage" width="55" height="55" />
     <p>Полето оградено от canvas:</p>
	<canvas id="sampleCanvas" width="330" height="165" style="border:1px solid #ffffff">
            Браузърт не поддържа тага canvas
</canvas>

     <script type="text/javascript">
	var canvas=document.getElementById("sampleCanvas");
	var ctx=canvas.getContext("2d");
	var img=document.getElementById("ddddImage")
	var pat=ctx.createPattern(img,"repeat");
	ctx.rect(0,0,330,165);
	ctx.fillStyle=pat;
	ctx.fill();
     </script>

</body>
</html>

Горната програма в браузъра изглежда по следния начин:

Изображението:

Полето оградено от canvas:

Браузърт не поддържа тага canvas