正文

纸飞机模拟一个物体在规定设计轴线偏离方位。

DrawTriangle(canvas, A, B, C) { (canvas) { 5 moveTo(A[0], A[1]); 6 lineTo(B[0], B[1]); 7 lineTo(C[0], C[1]); 8 lineTo(A[0], A[1]); 9 } 10 } DrawDarts(canvas, headx, heady, footx, footy) { 16 var c = document.getElementById(canvas); 17 var cxt = c.getContext("2d"); R = 150; headx1 = R + headx; 24 var heady1 = R - heady; footx1 = R + footx; 27 var footy1 = R - footy; footxl = R + (footx - 50); 31 var footyl = R - footy; footxr = R + (footx + 50); 35 var footyr = R - footy; footxu = R + footx; 39 var footyu = R - (footy - 50); footxd = R + footx; 43 var footyd = R - (footy + 50); cxt.beginPath(); 48 cxt.strokeStyle = "black"; 49 cxt.fillStyle = "#6C8D9F"; 50 var A = new Array(headx1, heady1); 51 var B = new Array(footx1, footy1); (parseInt(headx1) - parseInt(footx1) <= 0) 55 var C = new Array(footxr, footyr); C = new Array(footxl, footyl); 58 DrawTriangle(cxt, A, B, C); 59 60 cxt.fill(); 61 cxt.closePath(); 62 cxt.stroke(); cxt.beginPath(); 66 cxt.strokeStyle = "black"; 67 cxt.fillStyle = "#6C8D9F"; 68 var A1 = new Array(headx1, heady1); 69 var B1 = new Array(footxu, footyu); 70 var C1 = new Array(footxd, footyd); 71 DrawTriangle(cxt, A1, B1, C1); 72 cxt.fill(); 73 cxt.closePath(); 74 cxt.stroke(); 75 76 cxt.beginPath(); 77 cxt.strokeStyle = "black"; 78 cxt.fillStyle = "#6C8D9F"; 79 var A2 = new Array(headx1, heady1); 80 var B2 = new Array(footx1, footy1); 81 if (parseInt(headx1) - parseInt(footx1) <= 0) 82 var C2 = new Array(footxl, footyl); C2 = new Array(footxr, footyr); 85 DrawTriangle(cxt, A2, B2, C2); 86 cxt.fill(); 87 cxt.closePath(); 88 cxt.stroke(); 89 }

html 页面调用

HTML Canvas 画纸飞机浏览器不支持HTML5！ DrawDarts()

预览效果图

效果图2：