标签:ext func get begin context 元素 java cti log
html5 中的 canvas 元素使用 javascript 在网页上绘制图像,今天就写一下如何使用 canvas 绘制一个五角星。
代码如下:
html 代码
<canvas id="myCanvas">你的浏览器不支持canvas</canvas>
javascript 代码
<script type="text/javascript"> var canvas=document.getElementById("myCanvas"); var context=canvas.getContext(‘2d‘); canvas.width=300; canvas.height=300; create5star(context); context.stroke(); function create5star(context){ var dx=200; var dy=100; var s=100; context.beginPath(); context.fillStyle="red"; var dig=Math.PI/5*4; for(var i=0;i<5;i++){ var x=Math.sin(i*dig); var y=Math.cos(i*dig); context.lineTo(dx+x*s,dy+y*s); } context.closePath(); } </script>
效果图:
标签:ext func get begin context 元素 java cti log
原文地址:http://www.cnblogs.com/jyfeng/p/7151503.html