Deseń tekstu (HTML5 canvas)

Deseń tekstu

Niektóre przeglądarki nie obsługują tej możliwości.

Aby stworzyć deseń wczytujemy obrazek, tworzymy deseń używając polecenia createPattern(obrazek, sposób powielenia).

Następnie właściwości fillStyle przypisujemy utworzony deseń.

Zawartość możesz zobaczyć w
przeglądarce obsługującej element <canvas>
z kontekstem "2d"

Listing

	var cv = document.getElementById("canvas");
	var ctx = cv.getContext("2d");
	var image = new Image();
	   image.onload = function() {
	   	 var pattern = ctx.createPattern(image, 'repeat');
	        ctx.fillStyle = pattern;
	        ctx.font="192px san-serif";
	        ctx.fillText("Smok", 50, 150);
	        ctx.strokeText("Smok", 50, 150);
	   };
	   image.src = "images/cegla.png";