绘制普通直线,先看效果图:实现代码如下:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title> ...
绘制普通直线,先看效果图:
实现代码如下:
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script> function drawGraph(id) { var canvas=document.getElementById(id); var context=canvas.getContext("2d"); context.fillStyle="#CC00FF" //最外层canvas颜色 context.fillRect(0,0,300,300)//最外层canvas区域 context.beginPath() context.fillStyle="#008B8B"//填充颜色 context.strokeStyle="#FFFF00"//线的颜色 var dx=150 var dy=150 var s=100 var dig=Math.PI/15*11 for(var i=0;i<30;i++) { var x=Math.sin(i*dig) var y=Math.cos(i*dig) context.lineTo(dx+x*s,dy+y*s) } context.closePath()//关闭路径 context.fill()//填充颜色 context.stroke() } </script></head><body onload="drawGraph('canvasId')"><canvas id="canvasId" width="300" height="400"></canvas></body></html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com
原标题：html5学习笔记6
关键词：HTML
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
