Método de preenchimento de tela HTML ()

❮ Referência de tela HTML

Exemplo

Desenhe dois retângulos de 150*100 pixels. Preencha um com a cor vermelha e o outro com a cor azul:

Seu navegador não suporta a tag HTML5canvastag.

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");

ctx.beginPath();
ctx.rect(20, 20, 150, 100);
ctx.fillStyle = "red";
ctx.fill();

ctx.beginPath();
ctx.rect(40, 40, 150, 100);
ctx.fillStyle = "blue";
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
fill() Yes 9.0 Yes Yes Yes

Definição e uso

O método fill() preenche o desenho atual (caminho). A cor padrão é preto.

Dica: Use a propriedade fillStyle para preencher com outra cor/gradiente.

Observação: se o caminho não estiver fechado, o método fill() adicionará uma linha do último ponto ao ponto inicial do caminho para fechar o caminho (como closePath() ) e, em seguida, preencherá o caminho.

Sintaxe JavaScript: contexto .fill();

❮ Referência de tela HTML