Ele coloca pincel.fillRect(400, 0, 200, 400); Eu achava que (400, 0, 600, 400) faria mais sentido, e funciona. não entendi pq ele coloca 200 na posição final do x, sendo que o 0 (zero) fica do lado esquerdo, ele iria cobrir o verde, não?
Ele coloca pincel.fillRect(400, 0, 200, 400); Eu achava que (400, 0, 600, 400) faria mais sentido, e funciona. não entendi pq ele coloca 200 na posição final do x, sendo que o 0 (zero) fica do lado esquerdo, ele iria cobrir o verde, não?
Oi Renata, eu entendi da seguinte maneira. O 200 não é a posição inicial do x, na verdade é o primeiro 400 a posição de X então é a partir dai que o pincel vai começar a preencher, a posição 0 é de y que não precisa alterar, pois a altura é a mesma (400), o 200 é o tamanho que será preenchido de vermelho. O 600 funciona pq ele é maior que 200 então a "tinta" meio que "vasa" da tela e não vemos isso pois o limite de largura é 200 (a partir do eixo X 400). Se você aumentar a largura total para 800 por exemplo e aumentar também a cor "lightgrey" para 800, vai dar para entender melhor.
pincel.fillStyle = "lightgrey"; pincel.fillRect(0, 0, 800, 400);
Desculpa se não expliquei muito bem, pensei bastante na sua dúvida para entender também.