Código de JavaScript - Deshacer cambios en un canvas

Imágen de perfil
Val: 177
Ha disminuido 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Deshacer cambios en un canvasgráfica de visualizaciones


JavaScript

Publicado el 11 de Febrero del 2019 por Joan
526 visualizaciones desde el 11 de Febrero del 2019
Ejemplo de como deshacer una modificación en un canvas

Espero que sirva

Versión 1

Publicado el 11 de Febrero del 2019gráfica de visualizaciones de la versión: Versión 1
527 visualizaciones desde el 11 de Febrero del 2019
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<head>
 
</head>
<body>
 
</body>
    <canvas width="200" height="200" id="miCanvas"></canvas>
</html>
 
<script>
var canvas = document.getElementById('miCanvas'),
ctx = canvas.getContext('2d');
 
// Dibujamos un recuadro azul
ctx.fillStyle = 'blue';
ctx.fillRect(20,20,160,160);
 
// Guardamos en una variable un pantallazo del canvas
var imageData = ctx.getImageData(0,0,canvas.width,canvas.height);
 
// Dibujamos encima del recuadro azul un nuevo rectangulo rojo
ctx.fillStyle = 'red';
ctx.fillRect(10,30,180,60);
 
setTimeout(function () {
    // volvemos a la imagen anterior antes de escribir el rectangulo rojo
    ctx.putImageData(imageData, 0, 0);
}, 3000);
</script>



Comentarios sobre la versión: Versión 1 (0)


No hay comentarios
 

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s5066