JavaScript - canvas borrar un dibujo

   
Vista:
Imágen de perfil de Humberto

canvas borrar un dibujo

Publicado por Humberto humberto_molinalopez@hotmail.com (41 intervenciones) el 18/08/2016 07:35:59
necesito que el canvas haga que se borre el divujo que se creo mm masomenos un boton limpiar para poner otro codigo y no tener que estar cargando la pagina de nuevo.

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
32
33
<html>
  <head>
    <title>poner al canvas</title>
     <script type="text/javascript">
      function dibujar(){
        var canvas = document.getElementById('miCanvas');
        var contexto = canvas.getContext('2d');
        var n1=document.f1.txtn1.value;
        var v1=parseInt(25)+  parseInt(n1);
        var n2=document.f1.txtn2.value;
        var v2=parseInt(25)+ parseInt(n2);
        // curva cuadratica, esquina bien redondeada 
		  contexto.beginPath();
		  contexto.moveTo(v1,25);//aqui va le numero 1
		  contexto.lineTo(25,25);
		  contexto.quadraticCurveTo(25,25,25,75);
		  contexto.lineTo(25,v2);// aqui va el numero 2
		  contexto.fill();
	}
    </script>
  </head>
  <body>
  <form name="f1">
  <input type="text"  name="txtn1" placeholder="valor horizontal">
  <input type="text"  name="txtn2" placeholder="valor vertical">
  <input type="button" value="Calcular"  onclick="dibujar()">
  <input type="button" value="Limpiar"  onclick="">
<!-- necesito un boton de limpiar para este programa se divuja un triangulo conlas medidas que le des al programa-->
<br>
    <canvas id="miCanvas" width="450" height="350">Su navegador no soporta Canvas.</canvas>
    </form>
  </body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

canvas borrar un dibujo

Publicado por xve (1597 intervenciones) el 18/08/2016 09:00:57
Hola Humberto, la manera que yo utilizo es:
1
2
3
var canvas = document.getElementById('miCanvas');
var contexto = canvas.getContext('2d');
contexto.clearRect(0, 0, canvas.width, canvas.height);
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Humberto

canvas borrar un dibujo

Publicado por Humberto (41 intervenciones) el 18/08/2016 18:41:17
gracias! me funciono te lo agradezco mucho ase mucho que queria hacer eso :)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar