Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Não aparece o retangulo

console aparece erro na linha do getContext

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>test</title>
</head>
<body>

<canvas width="600" height="400"></canvas>

<script>


var tela = document.getElementById("canvas")
var pincel = tela.getContext("2d");


pincel.fillStyle = 'ligthgrey'
pincel.fillRect(0,0,600,400);




</script>

</body>
</html>
2 respostas
solução!

Olá Silmara, tudo bem com você?

Tem um pequeno errinho no seu código na hora de selecionar a tela, você digitou: var tela = document.getElementById("canvas"), entretanto o comando correto é:

var tela = document.querySelector("canvas");

Agora deve funcionar corretamente :)

Abraços e Bons Estudos!

Olá, Silmara! Tudo bom?

O problema está na própria declaração do getElementById , que na verdade teria que ser o querySelector.

var tela = document.querySelector("canvas")

Faça essa alteração e rode novamente!!! ;)

Bons estudos, Silmara! Vamos em frente!!!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software