3

Em um canvas, adicionei 10 pequenos quadrados, mas quero também poder alterar a posição desses quadrados continuamente, e que essa alteração seja desenhada na tela sempre quando o fizer (não preciso necessariamente de uma animação, apenas entender como posso atualizar o canvas sempre que quiser). Como posso fazer isso?

5
  • 2
    Não sei se entendi bem a dúvida, mas você precisa redesenhar tudo a cada quadro. Uma vez desenhado um objeto, não tem como movê-lo.
    – bfavaretto
    Commented 16/04/2015 às 22:46
  • @bfavaretto ...entetanto você pode copiar elementos imutáveis (tipo um background) para um outro canvas que você pode utilizar como buffer - sem necessidade de re-gerar todos os elementos de novo. (context.drawImage(oldCanvas, 0, 0);)
    – OnoSendai
    Commented 23/10/2015 às 19:52
  • @OnoSendai Isso tem muita vantagem de performance em relação a chamar uma função que gera um layer?
    – bfavaretto
    Commented 23/10/2015 às 20:18
  • @bfavaretto depende da complexidade e do número de objetos estáticos - minha experiência é que essa técnica pode ser uma mão na roda
    – OnoSendai
    Commented 23/10/2015 às 20:19
  • Legal, vou testar quando precisar disso. @OnoSendai
    – bfavaretto
    Commented 23/10/2015 às 20:23

2 Respostas 2

0

Use o context.clearRect para limpar o canvas ou apenas o quadrado. E então redesenhe.

-1

Para apagar você usa o context.clearRect(width,height);, para desenhar você usa o context.drawImage(imagem,x,y);.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .