javascript 常用代码大全（五）

 

// 9

一个可以在页面上随意画线、多边形、圆，填充等功能的js  （part 3） 
function mkRect(x, y, w, h) 
{ 
var s = this.stroke; 
this.mkDiv(x, y, w, s); 
this.mkDiv(x+w, y, s, h); 
this.mkDiv(x, y+h, w+s, s); 
this.mkDiv(x, y+s, s, h-s); 
} 

function mkRectDott(x, y, w, h) 
{ 
this.drawLine(x, y, x+w, y); 
this.drawLine(x+w, y, x+w, y+h); 
this.drawLine(x, y+h, x+w, y+h); 
this.drawLine(x, y, x, y+h); 
} 

function jsgFont() 
{ 
this.PLAIN = ’font-weight:normal;’; 
this.BOLD = ’font-weight:bold;’; 
this.ITALIC = ’font-style:italic;’; 
this.ITALIC_BOLD = this.ITALIC + this.BOLD; 
this.BOLD_ITALIC = this.ITALIC_BOLD; 
} 
var Font = new jsgFont(); 

function jsgStroke() 
{ 
this.DOTTED = -1; 
} 
var Stroke = new jsgStroke(); 

function jsGraphics(id, wnd) 
{ 
this.setColor = new Function(’arg’, ’this.color = arg.toLowerCase();’); 
this.setStroke = function(x) 
{ 
this.stroke = x; 
if (!(x+1)) 
{ 
this.drawLine = mkLinDott; 
this.mkOv = mkOvDott; 
this.drawRect = mkRectDott; 
} 
else if (x-1 > 0) 
{ 
this.drawLine = mkLin2D; 
this.mkOv = mkOv2D; 
this.drawRect = mkRect; 
} 
else 
{ 
this.drawLine = mkLin; 
this.mkOv = mkOv; 
this.drawRect = mkRect; 
} 
}; 

this.setPrintable = function(arg) 
{ 
this.printable = arg; 
if (jg_fast) 
{ 
this.mkDiv = mkDivIe; 
this.htmRpc = arg? htmPrtRpc : htmRpc; 
} 
else this.mkDiv = jg_n4? mkLyr : arg? mkDivPrt : mkDiv; 
}; 

this.setFont = function(fam, sz, sty) 
{ 
this.ftFam = fam; 
this.ftSz = sz; 
this.ftSty = sty || Font.PLAIN; 
}; 

this.drawPolyline = this.drawPolyLine = function(x, y, s) 
{ 
for (var i=0 ; i<x.length-1 ; i++ ) 
this.drawLine(x[i], y[i], x[i+1], y[i+1]); 
}; 

this.fillRect = function(x, y, w, h) 
{ 
this.mkDiv(x, y, w, h); 
}; 

this.drawPolygon = function(x, y) 
{ 
this.drawPolyline(x, y); 
this.drawLine(x[x.length-1], y[x.length-1], x[0], y[0]); 
}; 

this.drawEllipse = this.drawOval = function(x, y, w, h) 
{ 
this.mkOv(x, y, w, h); 
}; 

this.fillEllipse = this.fillOval = function(left, top, w, h) 
{ 
var a = (w -= 1)>>1, b = (h -= 1)>>1, 
wod = (w&1)+1, hod = (h&1)+1, 
cx = left+a, cy = top+b, 
x = 0, y = b, 
ox = 0, oy = b, 
aa2 = (a*a)<<1, aa4 = aa2<<1, bb = (b*b)<<1, 
st = (aa2>>1)*(1-(b<<1)) + bb, 
tt = (bb>>1) - aa2*((b<<1)-1), 
pxl, dw, dh; 
if (w+1) while (y > 0) 
{ 
if (st < 0) 
{ 
st += bb*((x<<1)+3); 
tt += (bb<<1)*(++x); 
} 
else if (tt < 0) 
{ 
st += bb*((x<<1)+3) - aa4*(y-1); 
pxl = cx-x; 
dw = (x<<1)+wod; 
tt += (bb<<1)*(++x) - aa2*(((y--)<<1)-3); 
dh = oy-y; 
this.mkDiv(pxl, cy-oy, dw, dh); 
this.mkDiv(pxl, cy+oy-dh+hod, dw, dh); 
ox = x; 
oy = y; 
} 
else 
{ 
tt -= aa2*((y<<1)-3); 
st -= aa4*(--y); 
} 
} 
this.mkDiv(cx-a, cy-oy, w+1, (oy<<1)+hod); 
}; 
this.fillPolygon = function(array_x, array_y) 
{ 
var i; 
var y; 
var miny, maxy; 
var x1, y1; 
var x2, y2; 
var ind1, ind2; 
var ints; 
var n = array_x.length; 
if (!n) return; 

miny = array_y[0]; 
maxy = array_y[0]; 
for (i = 1; i < n; i++) 
{ 
if (array_y[i] < miny) 
miny = array_y[i]; 
if (array_y[i] > maxy) 
maxy = array_y[i]; 
} 
for (y = miny; y <= maxy; y++) 
{ 
var polyInts = new Array(); 
ints = 0; 
for (i = 0; i < n; i++) 
{ 
if (!i) 
{ 
ind1 = n-1; 
ind2 = 0; 
} 
else 
{ 
ind1 = i-1; 
ind2 = i; 
} 
y1 = array_y[ind1]; 
y2 = array_y[ind2]; 
if (y1 < y2) 
{ 
x1 = array_x[ind1]; 
x2 = array_x[ind2]; 
} 
else if (y1 > y2) 
{ 
y2 = array_y[ind1]; 
y1 = array_y[ind2]; 
x2 = array_x[ind1]; 
x1 = array_x[ind2]; 
} 
else continue; 
if ((y >= y1) && (y < y2)) 
polyInts[ints++] = Math.round((y-y1) * (x2-x1) / (y2-y1) + x1); 
else if ((y == maxy) && (y > y1) && (y <= y2)) 
polyInts[ints++] = Math.round((y-y1) * (x2-x1) / (y2-y1) + x1); 
} 
polyInts.sort(integer_compare); 
for (i = 0; i < ints; i+=2) 
{ 
w = polyInts[i+1]-polyInts[i] 
this.mkDiv(polyInts[i], y, polyInts[i+1]-polyInts[i]+1, 1); 
} 
} 
}; 

this.drawString = function(txt, x, y) 
{ 
this.htm += ’<div style="position:absolute;white-space:nowrap;’+ 
’left:’ + x + ’px;’+ 
’top:’ + y + ’px;’+ 
’font-family:’ +  this.ftFam + ’;’+ 
’font-size:’ + this.ftSz + ’;’+ 
’color:’ + this.color + ’;’ + this.ftSty + ’">’+ 
txt + 
’<//div>’; 
} 

this.drawImage = function(imgSrc, x, y, w, h) 
{ 
this.htm += ’<div style="position:absolute;’+ 
’left:’ + x + ’px;’+ 
’top:’ + y + ’px;’+ 
’width:’ +  w + ’;’+ 
’height:’ + h + ’;">’+ 
’<img src="’ + imgSrc + ’" width="’ + w + ’" height="’ + h + ’">’+ 
’<//div>’; 
} 

this.clear = function() 
{ 
this.htm = ""; 
if (this.cnv) this.cnv.innerHTML = this.defhtm; 
}; 

this.mkOvQds = function(cx, cy, xl, xr, yt, yb, w, h) 
{ 
this.mkDiv(xr+cx, yt+cy, w, h); 
this.mkDiv(xr+cx, yb+cy, w, h); 
this.mkDiv(xl+cx, yb+cy, w, h); 
this.mkDiv(xl+cx, yt+cy, w, h); 
}; 
this.setStroke(1); 
this.setFont(’verdana,geneva,helvetica,sans-serif’, String.fromCharCode(0x31, 0x32, 0x70, 0x78), Font.PLAIN); 
this.color = ’#000000’; 
this.htm = ’’; 
this.wnd = wnd || window; 
if (!(jg_ie || jg_dom || jg_ihtm)) chkDHTM(); 
if (typeof id != ’string’ || !id) this.paint = pntDoc; 
else 
{ 
this.cnv = document.all? (this.wnd.document.all[id] || null) 
: document.getElementById? (this.wnd.document.getElementById(id) || null) 
: null; 
this.defhtm = (this.cnv && this.cnv.innerHTML)? this.cnv.innerHTML : ’’; 
this.paint = jg_dom? pntCnvDom : jg_ie? pntCnvIe : jg_ihtm? pntCnvIhtm : pntCnv; 
} 
this.setPrintable(false); 
} 
function integer_compare(x,y) 
{ 
return (x < y) ? -1 : ((x > y)*1); 
}