Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
No exercício "Trabalhando com imagens" desta aula, eu fiz código e copiei o que se pediu.
Quando fui abrir o arquivo em html, não apareceu nada. Não entendi porque não funcionou.
Se alguém puder enviar o código correto completo como resposta para comparar com o que eu fiz, eu agradeço.
Pedro peço que poste seu código para analisarmos juntos e verificar o problema.
O código que fiz foi este:
" "
Estou pelo celular agora mas consegui pegar o código que fiz. Sei que algo está errado mas não consigo achar o erro. Fiz o que se pediu o exercício mas talvez eu tenha entendido errado e feito o código incorreto.
O código que fiz foi este:
"<canvas id="tela" width="600" height="400"></canvas>
<script>
var tela = document.getElementById("tela");
var c = tela.getContext("2d");
var limpaTela = function() {
c.clearRect(0,0,600,400);
}
var x = 1;
var desenha = function() {
limpaTela();
circulo(x, 100, 10);
x = x + 1;
}
var imagem = new Image();
imagem.src = "http://www.caelum.com.br/imagens/instrutores/fotos/paulo-silveira-90.jpg";
var desenhaImagem = function(x, y) {
c.drawImage(imagem, x, y)
};
var desenha = function() {
limpaTela();
circulo(x, 100, 10);
desenhaImagem(x, 200);
//circulo(x, 100, x/2);
x = x + 1;
};
setInterval(desenha, 30);
</script>"
Fala Pedro não consigo ver o seu código. Teria como postar novamente?
<script>
var imagem = new Image();
imagem.src = "http://www.caelum.com.br/imagens/instrutores/fotos/paulo-silveira-90.jpg";
var desenhaImagem = function(x, y) {
c.drawImage(imagem, x, y)
};
var desenha = function() {
limpaTela();
circulo(x, 100, 10);
desenhaImagem(x, 200);
//circulo(x, 100, x/2);
x = x + 1;
};
</script>Tive que tirar o "<" do script porque código não estava aparecendo.
Pedro para postar códigos formatados você deve inseri-los entre três crases(`), tem um botão lado direito dando dicas de formatação.
Vamos la, o problema do seu código esta nesse trecho:
var desenha = function() {
limpaTela();
circulo(x, 100, 10);
desenhaImagem(x, 200);
//circulo(x, 100, x/2);
x = x + 1;
};A função circulo não existe mais, onde sua chamada acarretará em erro, apenas apague-a e o problema deve ser resolvido.
var desenha = function() {
limpaTela();
desenhaImagem(x, 200);
x = x + 1;
};Espero ter ajudado
Consertei o código, mas quando abro no browser, a página fica em branco.
Veja seu console, deve estar dando algum problema, poste a saída para mim.
Pois para rodar seu código aqui apenas retirei a chamado a função circulo.
Fico no aguardo
Eu vi o console, la diz que não esta dando nenhum problema. Como faço para consertar?
Pedro rode exatamente com esse código
<canvas id="tela" width="600" height="400"></canvas>
<script>
var tela = document.getElementById("tela");
var c = tela.getContext("2d");
var limpaTela = function() {
c.clearRect(0,0,600,400);
}
var imagem = new Image();
imagem.src = "http://www.caelum.com.br/imagens/instrutores/fotos/paulo-silveira-90.jpg";
var desenhaImagem = function(x, y) {
c.drawImage(imagem, x, y)
};
var x = 1;
var desenha = function() {
limpaTela();
desenhaImagem(x, 200);
x = x + 1;
};
setInterval(desenha, 30);
</script>Para mim esta funcionando.
Agora funcionou! Obrigado Matheus!
De nada Pedro, sempre que precisar não deixe de criar suas dúvidas.
Provavelmente o erro estava no c.drawImage(imagem, x, y); Ele devia esta colocando c.drawImage( Imagem , x, y); o I de imagem esta causando o erro provavelmente.