canvas(path) 你的名字 2022-06-03 02:54 156阅读 0赞 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> canvas{ background: #ddd; } </style> </head> <body> <h2>canvas——路径</h2> <canvas id="c2" width="500" height="400"> 您的浏览器版本太低，请升级！ </canvas> <script> var c2=document.getElementById('c2'); var ctx=c2.getContext('2d'); //三角形 ctx.strokeStyle="red"; ctx.beginPath(); ctx.moveTo(250,50); ctx.lineTo(300,100); ctx.lineTo(200,100); ctx.closePath(); ctx.stroke(); //圆 ctx.beginPath(); ctx.arc(250,200,50,0,2*Math.PI); ctx.closePath(); ctx.stroke(); //圆拱 ctx.beginPath(); ctx.arc(300,200,50,0*Math.PI/180,180*Math.PI/180); ctx.stroke(); //这个放到里面会画出拱形，放到外面则会多出一条线 ctx.closePath(); </script> </body> </html>
还没有评论，来说两句吧...