|
Posted on
2009-02-17 20:53
dfsoft
阅读( 1713)
评论()
收藏
举报
 Code
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
2 <html xmlns:v="">
3 <head>
4 <title>Draw</title>
5 <meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
6 <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
7 <script language="javascript">
8
9 //画线
10 //X1,Y1:左上坐标
11 //X2,Y2:右下坐标
12 function Line(X1, Y1, X2, Y2)
13 {
14 var points = [];
15 var line = null;
16
17 points = [];
18
19 var s = "<v:line from='" + X1 + "," + Y1 + "' to='" + X1 + "," + Y1 +"' style='position:absolute;left:0px;top:0px;'></v:line>";
20 points.push( {x:X1, y:Y1});
21
22 var o = document.createElement(s);
23 document.body.insertAdjacentElement('BeforeEnd', o);
24 line = o;
25 line.to = X2 + "," + Y2;
26 }
27
28 //画矩形
29 //X1,Y1:左上坐标
30 //X2,Y2:右下坐标
31 function Rect(X1, Y1, X2, Y2)
32 {
33 Line(X1, Y1, X2, Y1);
34 Line(X2, Y1, X2, Y2);
35 Line(X2, Y2, X1, Y2);
36 Line(X1, Y2, X1, Y1);
37 }
38
39 //画矩形
40 //X1,Y1:左上坐标
41 //W:宽
42 //H:高
43 function Rect_(X1, Y1, W, H)
44 {
45 Line(X1, Y1, X1 + W, Y1);
46 Line(X1 + W, Y1, X1 + W, Y1 + H);
47 Line(X1 + W, Y1 + H, X1, Y1 + H);
48 Line(X1, Y1 + H, X1, Y1);
49 }
50
51 //画不规则多边形
52 //X, Y:点坐标
53 function Poly(Coord)
54 {
55 var Coords = Coord.split(",");
56
57 Coords.push(Coords[0], Coords[1]);
58
59 for(var i = 0;i < Coords.length - 2; i += 2)
60 {
61 Line(Coords[i], Coords[i + 1], Coords[i + 2], Coords[i + 3]);
62 }
63 }
64
65 //画旋转矩形
66 //X1,Y1:左上坐标
67 //W:宽
68 //H:高
69 //A:左上点顺时针旋转角度
70 function Cric(X1, Y1, W, H, A)
71 {
72 var X2, Y2, X3, Y3, X4, Y4;
73
74 X2 = W * Math.cos(A * 3.14 / 180) + X1;
75 Y2 = W * Math.sin(A * 3.14 / 180) + Y1;
76
77 X3 = X2 - H * Math.sin(A * 3.14 / 180);
78 Y3 = H * Math.cos(A * 3.14 / 180) + Y2;
79
80 X4 = X3 - W * Math.cos(A * 3.14 / 180);
81 Y4 = Y3 - W * Math.sin(A * 3.14 / 180);
82
83 Line(X1, Y1, X2, Y2);
84 Line(X2, Y2, X3, Y3);
85 Line(X3, Y3, X4, Y4);
86 Line(X4, Y4, X1, Y1);
87 }
88 </script>
89 <style type="text/css">
90 v\:* {behavior:url(#default#VML);}
91 </style>
92 </head>
93 <body>
94 </body>
95 <script language=javascript>
96 Line(1, 1, 50, 50);
97 Rect_(40, 40, 50, 50);
98 Poly("1,1,250,1,500,500,250,500");
99 Cric(300, 300, 200, 100, 30)
100 </script>
101 </html>
102
|