Entrar Ainda não tem acesso?
5
respostas

Tamanho do retangulo verde

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Desenhando gráficos com Canvas e atividade A cara do Creeper

por Anne
| 13.8k xp | 16 posts

Fiz meu código desta maneira, mas não consegui entender o por que do retangulo verde cortar pela metade meu desenho. Eu conferi com o do professor e esta com as medidas certas, a unica diferença é que a referencia que o professor usou nao foi partindo do eixo 0. Pelo menos foi o que entendi. 

<meta charset="utf-8">

<canvas width="600" heigth="400"></canvas>
<script> 

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

pincel.fillStyle = "darkgreen";
pincel.fillRect(0,0,350,300);

pincel.fillStyle = 'black'; 
pincel.fillRect(40, 50, 90, 90); 

pincel.fillStyle = 'black'; 
pincel.fillRect(200,50,90,90); 

pincel.fillStyle = 'black'; 
pincel.fillRect(130, 140, 70, 100); 

pincel.fillStyle = 'black'; 
pincel.fillRect(90, 190, 40, 110);

pincel.fillStyle = 'black'; 
pincel.fillRect(200, 190, 70, 100);  


</script>
5 respostas
por viniciuscipolli
| 102.6k xp | 27 posts

Manda um link de um print. Tira o print > salva usando o paint > sobe no https://imgur.com/

por Anne
| 13.8k xp | 16 posts

https://imgur.com/a/1Ebfn9G

Seria isso ?

por viniciuscipolli
| 102.6k xp | 27 posts

Clica com o botão direito > Exibir código fonte e manda aqui pra gente

por Anne
| 13.8k xp | 16 posts
<html><head><meta charset="utf-8">

</head><body><canvas width="600" heigth="400"></canvas>
<script> 

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

pincel.fillStyle = "darkgreen";
pincel.fillRect(0,0,350,300);

pincel.fillStyle = 'black'; 
pincel.fillRect(40, 50, 90, 90); 

pincel.fillStyle = 'black'; 
pincel.fillRect(200,50,90,90); 

pincel.fillStyle = 'black'; 
pincel.fillRect(130, 140, 70, 100); 

pincel.fillStyle = 'black'; 
pincel.fillRect(90, 190, 40, 110);

pincel.fillStyle = 'black'; 
pincel.fillRect(200, 190, 70, 100);  


</script>
</body></html>
por viniciuscipolli
| 102.6k xp | 27 posts

Anne, o problema é mais simples do que parece, você escreveu heigth ao invés de height. Corrigindo isso deve resolver. Sugiro que você use extensões para mostrar erros como esse, caso você use o VS code recomendo o Code Spell Checker para ajudar.

Se isso resolver marque como solução aqui :D.