6.HTML5 Canvas 绘图-2

来源:互联网 发布:android 淘宝筛选界面 编辑:程序博客网 时间:2024/06/05 02:29
 <script>  var canvas=null;  var context=null;  window.onload=function(){  canvas=document.getElementById("drawCanvas");  context=canvas.getContext("2d");    context.beginPath();  context.moveTo(10,10);  context.lineTo(100,100);  context.strokeStyle="red";  context.lineWidth=20;  context.lineCap="butt";  context.stroke();  };    function startDrawing(){  context.beginPath();  context.moveTo(0,0);  }  function drawing(){  context.lineTo(e.pageX-canvas.offsetLeft,e.pageY-canvas.offsetTop);  context.stroke();  }  function clearCanvas(){  context.clearRect(0,0,canvas.width,canvas.height);  }  function saveImgFormCanvas(){  var img=document.getElementById("savedImageCopy");  img.src=canvas.toDataUrl();  }  </script>  <canvas id="drawCanvas"></canvas> <img id="savedImageCopy"><br>

0 0