用贝塞尔曲线绘制聊天气泡

<div class="iteye-blog-content-contain" style="font-size: 14px">

<!DOCTYPE html>
<html>
  <head>
<!--[if IE]>
<script type="text/javascript" src="excanvas.js"></script>
<script type="text/javascript" src="excanvas.compiled.js"></script>
<![endif]-->
     <script type="text/javascript">
	 function draw() {
       var canvas = document.getElementById("cv"); 
  	   if (canvas.getContext) { 
       var ctx = canvas.getContext("2d");
       	   // Quadratric curves example ctx.beginPath(); 
       	   ctx.moveTo(75,25); 
       	   ctx.quadraticCurveTo(25,25,25,62.5); 
       	   ctx.quadraticCurveTo(25,100,50,100); 
       	   ctx.quadraticCurveTo(50,120,30,125); 
       	   ctx.quadraticCurveTo(60,120,65,100); 
       	   ctx.quadraticCurveTo(125,100,125,62.5); 
       	   ctx.quadraticCurveTo(125,25,75,25); 
       	   ctx.stroke();
       }  
    }   
    </script>
    <title>用贝塞尔曲线绘制聊天气泡</title>
  </head>
  <body onload="draw();" > 
      <canvas id="cv" width="150" height="150">
      </canvas>
  </body>
</html>

 </div>

猜你喜欢

转载自hylxinlang.iteye.com/blog/1882913