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

MINHA IMG NAO APARECE

A minha imagem não aparece... Está tudo na mesma pasta :~~

<canvas id="tela" width="600" height="600"></canvas>

<script>

var c = tela.getContext("2d");

function moldura(x,y) {
  var tela = document.getElementById("tela");

c.fillStyle = "white";
c.fillRect(x,y,600,600);
c.strokeStyle = "#33a6cc";
c.strokeRect(0,0,600,600);

};

moldura(0,0);

var imagem = new Image();
  imagem.src = "chakra.jpg"

function desenhaImagem(x,y) {
    c.drawImage(imagem, x, y);
}

function desenha() {
    limpaTela();
    circulo(x, 100, 10);
    desenhaImagem(x, 200);
    x = x + 1;
}

setInterval(desenhaImagem, 80);

</script>
4 respostas

Olá Rose,

Você poderia postar seu código para darmos uma olhada? (:

Malz, achei que tinha postado...

<canvas id="tela" width="600" height="600"></canvas>

<script>

var c = tela.getContext("2d");

function moldura(x,y) {
  var tela = document.getElementById("tela");

c.fillStyle = "white";
c.fillRect(x,y,600,600);
c.strokeStyle = "#33a6cc";
c.strokeRect(0,0,600,600);

};

moldura(0,0);

var imagem = new Image();
  imagem.src = "chakra.jpg"

function desenhaImagem(x,y) {
    c.drawImage(imagem, x, y);
}

function desenha() {
    limpaTela();
    circulo(x, 100, 10);
    desenhaImagem(x, 200);
    x = x + 1;
}

setInterval(desenhaImagem, 80);

</script>

Olá Rose,

Primeiramente, eu chequei seu código na descrição do tópico, é que faltou a marcação ``` ao redor do código. Exemplo:

```

seu código

```

já arrumei pra você.

solução!

Agora quanto a sua dúvida, faltaram alguns detalhes.

primeiro a variável x tem que ser inicializada antes da criação do método desenha().

var x = 1;

Segundo, faltou você criar o método limpaTela(); que é chamado dentro de desenha().

var limpaTela = function(){
    c.clearRect(0,0,600,400);
};

e o método circulo() não é mais usado também. então pode retirar a chamada dele dentro do método desenha().

e então, dentro de setInterval() chamaremos a função desenha() ao invés de desenhaImagem().

setInterval(desenha, 80);

Teste essas modificações e retorne dizendo se funcionou! (: