Http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm#docu
Example: 1 < Html > < Head >
2
3 < Script Type = "Text/JavaScript" SRC = "Wz_jsgraphics.js" > </ Script >
4 </ Head >
5 < Body Bgcolor = "# Ffffff" Onload = "" >
6 < P ID = "Mycanvas" > </ P >
7
8 < Script Type = "Text/JavaScript" >
9
10 Function Mydrawfunction ()
11 {
12 Jg_doc.setcolor ( " #00ff00 " ); // Green
13 Jg_doc.fillellipse ( 100 , 200 , 100 , 180 ); // Co-ordinates related to the document
14 Jg_doc.setcolor ( " Maroon " );
15 Jg_doc.drawpolyline ( New Array ( 50 , 10 , 120 ), New Array ( 10 , 50 , 70 ));
16 Jg_doc.paint (); // Draws, in this case, directly into the document
17
18 JG. setcolor ( " # Ff0000 " ); // Red
19 JG. drawline ( 10 , 113 , 220 , 55 ); // Co-ordinates related to "mycanvas"
20 JG. setcolor ( " # 0000ff " ); // Blue
21 JG. fillrect ( 110 , 120 , 30 , 60 );
22 JG. Paint ();
23
24 Jg2.setcolor ( " # 0000ff " ); // Blue
25 Jg2.drawellipse ( 10 , 50 , 30 , 100 );
26 Jg2.drawrect ( 400 , 10 , 100 , 50 );
27 Jg2.paint ();
28 }
29
30 // VaR jg_doc = new jsgraphics (); // draw directly into document
31 VaR Jg_doc = New Jsgraphics ( " Mycanvas " );
32
33 Mydrawfunction ();
34
35 </ Script >
36
37 </ Body > </ Html >
Its implementation method is to use Div to implement vertices. Others are drawn by vertices. 1 Function _ mkdiv (X, Y, W, H)
2 {
3 This.htm + =' < Div Style = "Position: absolute; '+
4 'Left: '+ x + 'px;' +
5 'Top: '+ Y + 'px;' +
6 'Width: '+ W + 'px;' +
7 'Height: '+ H + 'px;' +
8 'Clip: rect (0, '+ W + 'px,' + H + 'px, 0); '+
9 'Background-color: '+ this. color +
10 (! Jg_moz? '; Overflow: Den den': '') +
11 ';" > < \/Div > ';
12 }
13
14 Function _ mkdivie (X, Y, W, H)
15 {
16 This.htm + = '%' + this. color + ';' + x + ';' + Y + ';' + W + ';' + H + ';';
17 }
There is also a tooltip library and dragdrop library.
Http://www.walterzorn.com/tooltip/tooltip_e.htm
Http://www.walterzorn.com/dragdrop/dragdrop_e.htm