Manual de referência HTML

Catálogo de etiquetas HTML

Método fill() do canvas HTML

fill() é o Canvas 2O método fill() do Canvas D API preenche o caminho atual ou existente com base no estilo de preenchimento atual. Adota as regras de contorno não nulo ou de contorno par/impar.

Manual de referência do canvas HTML

Exemplo online

Desenhar 100*100 pixel quadrado, em seguida, pintá-lo com vermelho:

Exemplo

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Uso do método fill() do canvas HTML-Tutorial básico(oldtoolbag.com)</<title>
</<head>
<body>
<canvas id="myCanvas" width="300" height="150" style="border:1px sólido #d3d3d3>
Seu navegador não suporta HTML5　canvas etiqueta.
</canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.rect(20,20,100,100);
ctx.fillStyle="red";
ctx.fill();
</script>　
</body>
</html>

Teste e veja ‹/›

Compatibilidade do navegador

IEFirefoxOperaChromeSafari

Internet Explorer 9、Firefox、Opera、Chrome e Safari suportam fill() método.

Atenção:Internet Explorer 8 e versões anteriores não suportam o elemento <canvas>.

Definição e uso

O método fill() preenche a forma atual (caminho).A cor padrão é preta.

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

Atenção:Se o caminho não estiver fechado，o método fill() adicionará uma linha entre o ponto final e o inicial do caminho para fechar o caminho (como closePath() da mesma forma），então preenche o caminho.

Sintaxe JavaScript:	context.fill();

Manual de referência do canvas HTML

HTML: <template> etiqueta