Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > it.comp.lang.javascript > #8050

Canvas di HTML5, cancellazione contenuto

Newsgroups it.comp.lang.javascript
From "leonardo.1+++" <leonardo.1@fastwebnet.it>
Subject Canvas di HTML5, cancellazione contenuto
Message-ID <G8Imz.47842$pt.5792@tornado.fastwebnet.it> (permalink)
Date 2016-07-29 14:40 +0200

Show all headers | View raw


Fase 1: disegno un segmento sulla canvas
Fase 2: cancello il contenuto della canvas con:
ctx.clearRect(0, 0, canvas.width, canvas.height);
Fase 3: cambio i valori x1,y1 e x2,y2 e disegno nuovo segmento.
Problema:
perché disegna di nuovo anche il segmento precedentemente cancellato?
Questo il codice:
<!doctype html>
<html>
<head>

<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function() {

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

$("#Cancella").click(function(){  // alert("fatto click sul Cancella");
  ctx.clearRect(0, 0, canvas.width, canvas.height);

   });

$("#Esegui").click(function(){// alert("fatto click sul Esegui");

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

var $x1 = $('[name="x1"]').val(); // alert($x1);
var $y1 = $('[name="y1"]').val();// alert($y1);

var $x2 = $('[name="x2"]').val();// alert($x2);
var $y2 = $('[name="y2"]').val();// alert($y2);

ctx.moveTo($x1,$y1);
ctx.lineTo($x2,$y1);
ctx.stroke();

  });

       });
     </script>

</head>
<body>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid 
#000;"></canvas>
<p>
  x1:  <input name="x1" type="text" id="x1" value="10">
  y1: <input name="y1" type="text" id="y1" value="20">
</p>
<p>
   x2: <input name="x2" type="text" id="x2" value="30">
   y2: <input name="y2" type="text" id="y2" value="40">
</p>
<p>
   <input type="submit" name="Esegui" id="Esegui" value="Esegui">
   <input type="submit" name="Cancella" id="Cancella" value="Cancella">
</p>

</body>
</html>

Grazie a chi potrà darmi lumi.
Saluti


-- 
Non sono su facebook
Se anche tu vuoi cancellarti
http://www.giardiniblog.com/come-cancellarsi-da-facebook-eliminare-account/

Back to it.comp.lang.javascript | Previous | NextNext in thread | Find similar


Thread

Canvas di HTML5, cancellazione contenuto "leonardo.1+++" <leonardo.1@fastwebnet.it> - 2016-07-29 14:40 +0200
  Re: Canvas di HTML5, cancellazione contenuto Alessandro Pellizzari <shuriken@amiran.it> - 2016-07-29 14:40 +0100
    Re: Canvas di HTML5, cancellazione contenuto "leonardo.1+++" <leonardo.1@fastwebnet.it> - 2016-07-29 16:33 +0200

csiph-web