3
respostas

por algum motivo ele fica falando que 'pincel' n é uma função, sendo que no vídeo deu tudo certo

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

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');

    pincel.fillReact(0, 0, 600, 400);
    pincel.fillStyle = 'lightgrey'

</script>
3 respostas

Olá Arthur,

Esse erro está ocorrendo porque a função fillRect foi escrita de maneira errada:

troque:

pincel.fillReact(0, 0, 600, 400);

por:

pincel.fillRect(0, 0, 600, 400);

O código completo ficará da seguinte forma:

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

<script>

  var tela = document.querySelector('canvas');
  var pincel = tela.getContext('2d');

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

</script>

Olá, fiz um post pedindo ajuda, mas acabei de descobrir a solução. Manterei o post aqui, porque outros podem vir a ter o mesmo problema. No código abaixo, o 2D (maiúsculo) deveria ser 2d (minúsculo), por isso, dava erro. O interessante é que o JS não aponta exatamente este erro na console.

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


<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2D');

    pincel.fillRect(0, 0, 600, 400);


</script>

E este é o erro que estou recebendo na Console:

Uncaught TypeError: Cannot read property 'fillRect' of null at programa.html:10

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