1 <!DOCTYPE HTML>
2 <html lang="en-US">
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <canvas id="diagonal" style="border:1px solid;" width="200" height="200"></canvas>
9 <script>
10 function drawDiagonal(){
11 //取得canvas元素及其绘图上下文
12 var canvas = document.getElementById('diagonal');
13 var context = canvas.getContext('2d');
14
15 //用绝对坐标来创建一条路径
16 context.beginPath();
17 context.moveTo(100,50);
18 context.lineTo(50,150);
19 context.lineTo(170,90);
20 context.lineTo(30,90);
21 context.lineTo(150,150);
22 context.lineTo(100,50);
23
24 //将这条线绘制到canvas上
25 context.stroke();
26 }
27
28 window.addEventListener("load",drawDiagonal,true);
29 </script>
30 </body>
31 </html>
随便画画一个五角星
转载于:https://www.cnblogs.com/qzsonline/archive/2012/08/28/2660351.html
相关资源：Android中Canvas绘图基础详解
