Método createPattern() da tela HTML

Imagem para usar:

Luminária

Exemplo

Repita uma imagem na horizontal e na vertical:

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("lamp");
var pat = ctx.createPattern(img, "repeat");
ctx.rect(0, 0, 150, 100);
ctx.fillStyle = pat;
ctx.fill();

Suporte ao navegador

Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao método.

Method
createPattern()	Yes	9.0	Yes	Yes	Yes

Definição e uso

O método createPattern() repete o elemento especificado na direção especificada.

O elemento pode ser uma imagem, vídeo ou outro elemento <canvas>.

O elemento repetido pode ser usado para desenhar/preencher retângulos, círculos, linhas etc.

Sintaxe JavaScript:	context .createPattern( imagem ,"repetir\|repetir-x\|repetir-y\|sem repetição");

Valores de parâmetro

Parameter	Description	Play it
image	Specifies the image, canvas, or video element of the pattern to use
repeat	Default. The pattern repeats both horizontally and vertically
repeat-x	The pattern repeats only horizontally
repeat-y	The pattern repeats only vertically
no-repeat	The pattern will be displayed only once (no repeat)

❮ Referência de tela HTML