📄 jsgraphics.js
字号:
// JScript 文件
/* This notice must be untouched at all times.
jsgraphics.js v. 1.00
Any question please contact mathcn@126.com
Copyright (c) mathcn@126.com All rights reserved.
Created 1. 20. 2007 by mathcn in China
Last modified: 1. 20. 2007
个人简介：周胜军，06年就读于大连理工计算数学研究生,研究曲面匹配,擅长网络编程asp,asp.net,c#,javascript,Dom,xml,vb,css,Ajax,dhtml......
此信息寻工作用QQ418806107
*/
var color="Black",pen_w=1,pen_h=1,canvas_height,canvas_width;
var output="";
function setColor(pen_color)
{
color=pen_color;
}
function setPen(pen_w_temp,pen_h_temp)
{
pen_w=pen_w_temp;pen_h=pen_h_temp;
}
function point(x,y)
{
output +='<div style="position:absolute;left: '+x+'px; bottom: '+y+'px; overflow:hidden; background-color:'+color+'; width:'+pen_w+'px; height:'+pen_h+'px;"></div>';
}
function mkDiv(x,y,pen_w,pen_h)
{
output +='<div style="position:absolute;left: '+x+'px; bottom: '+y+'px; overflow:hidden; background-color:'+color+'; width:'+pen_w+'px; height:'+pen_h+'px;"></div>';
}
function paint(OBJ)
{
document.getElementById(OBJ).innerHTML=output;
output="";
}
function clear(OBJ)
{
var TT=document.getElementById(OBJ);
if(TT!=null)
{
while(TT.childNodes.length>0)
{
TT.removeChild(TT.childNodes[0]);
}
}
}
//画直线 Bresenham算法
function drawLine(x1,y1,x2,y2)
{
var dx=x2-x1,dy=y2-y1;
if(Math.abs(dy)<0.5){dy=0;}
if(Math.abs(dx)<0.5){dx=0;}
if((dx)*(dy)==0)
{
if((dx)==0&&(dy)==0) {this.point(x1,y1);}
if((dy)==0&&(dx)!=0)
{
if(dx<0){ temp=x2;x2=x1;x1=temp;}
mkDiv(x1,y1,Math.abs(dx),pen_h);
}
if((dx)==0&&(dy)!=0)
{
if(dy<0){ temp=y2;y2=y1;y1=temp;}
mkDiv(x1,y1,pen_w,Math.abs(dy));
}
}else
{
var x=x1,y=y1,interchange;
var dx=Math.abs(x2-x),dy=Math.abs(y2-y1);
var s1=sign(x2-x1),s2=sign(y2-y1);
if(dy>dx) {var temp=dx;dx=dy;dy=temp;interchange=1; }
else{interchange=0;}
var eb=2*dy-dx;
for(var i=0;i<=dx;i++)
{
mkDiv(x,y,pen_w,pen_h);
while(eb>0)
{
if(interchange==1){x=x+s1;}else{y=y+s2;}
eb=eb-2*dx;
}
if (interchange==1){y=y+s2;}else{x=x+s1;}
eb=eb+2*dy;
}
}
this.sign=function sign(x){if(x==0){return 0;}if(x>0){return 1;}else{return -1;}}
}
function drawPolyline(X,Y)
{
var n=X.length;
for(var i=0;i<n;i++){ drawLine(X[i],Y[i],X[i+1],Y[i+1]);}
}
function drawPolygon(X,Y)
{
var n=X.length;
for(var i=0;i<n;i++){ drawLine(X[i],Y[i],X[i+1],Y[i+1]);}
drawLine(X[0],Y[0],X[n-1],Y[n-1]);
}
function drawEllipse(x0,y0,a,b)
{
var rad=Math.PI/180;
for(var i=0;i<360;i=i+2)
{
drawLine(x0+a*Math.cos(i*rad),y0+b*Math.sin(i*rad),xi=x0+a*Math.cos((i+2)*rad),yi=y0+b*Math.sin((i+2)*rad));
}
}
function fillEllipse(x0,y0,a,b)
{
var X=new Array,Y=new Array;
var rad=Math.PI/180;
for(var i=0;i<360;i=i+5)
{
X[i/5]=x0+a*Math.cos(i*rad);
Y[i/5]=y0+b*Math.sin(i*rad);
}
fillPolygon(X,Y);
}
function pie(x0,y0,r,a,b)
{
a=Math.floor(a),b=Math.floor(b);
while(Math.abs(a)>360){a=a%360;}
while(Math.abs(b)>360){b=b%360;}
if(a>b){var temp=a;a=b;b=temp;}
var X=new Array,Y=new Array;
var rad=Math.PI/180;
var k=0;
for(var i=a;i<=b;i=i+2)
{
X[k]=x0+r*Math.cos(i*rad);
Y[k]=y0+r*Math.sin(i*rad);
k++;
}
X[k]=x0;
Y[k]=y0;
fillPolygon(X,Y);
}
function pieChart(x0,y0,r,p,X,Color)
{
var Max_flag=Max_flag(X);
var sum=0,n=X.length;
var rad=Math.PI/180;
var FT=new Array;
var DU=new Array;
for(var i=0;i<n;i++){sum=sum+X[i];}
for(var i=0;i<n;i++){var temp=X[i]/sum;DU[i]=360*temp;FT[i]=Math.round(1000*temp)/10; }
var Z=new Array;
for(var i=0;i<n;i++)
{
var sum_temp=0;
for(var j=0;j<=i;j++){sum_temp+=DU[j];}
Z[i]=sum_temp;
}
Z[n-1]=360;
for(var i=0;i<n-1;i++)
{
DU[i+1]=(Z[i+1]+Z[i])/2;
}
DU[0]=Z[0]/2;
if(p==null){p=4}
if(p!=0)
{
var q=2*p;
for(var i=1;i<n;i++)
{
if(Color){setColor(Color[i]);if(!Color[i]){setColor("Green");}}
pie(x0+p*Math.cos(DU[i]*rad),y0+p*Math.sin(DU[i]*rad),r,Z[i-1],Z[i]);
}
if(Color){setColor(Color[0]);}
pie(x0+p*Math.cos(DU[0]*rad),y0+p*Math.sin(DU[0]*rad),r,0,Z[0]);
}
else
{
for(var i=1;i<n;i++)
{
if(Color){setColor(Color[i]);if(!Color[i]){setColor("Green");}}
pie(x0,y0,r,Z[i-1]-1,Z[i]);
}
if(Color){setColor(Color[0]);}
pie(x0,y0,r,0,Z[0]);
}
var txt,pp=0.7*r;
for(var i=0;i<n;i++)
{
txt=FT[i]+"%";
drawStringRect(txt,x0+pp*Math.cos(DU[i]*rad),y0+pp*Math.sin(DU[i]*rad),30,15,9,"White");
}
this.Max_flag=function Max_flag(arry)
{
var temp=0,flag;
for(var i=0;i<arry.length;i++) { if(temp<arry[i]){temp=arry[i];flag=i;} }
return flag;
}
}
//this function is implemented from Walter Zorn.com 扫描线填充 thanks Walter Zorn.
function fillPolygon(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)
mkDiv(polyInts[i], y, polyInts[i+1]-polyInts[i]+1, 1);
}
this.integer_compare=function integer_compare(x,y)
{
return (x < y) ? -1 : ((x > y)*1);
}
}
function drawStringRect(txt,x,y,w,h,size,ftcolor)
{
this.ftout=function ftout(txt,x,y,w,h,size,ftcolor)
{
output+='<div style="position:absolute;left: '+x+'px; bottom: '+y+'px; overflow:hidden;font-size:'+size+'px;color:'+ftcolor+'; background-color:Transparent; width:'+w+'px; height:'+h+'px;">'+txt+'</div>'
}
if(!size){size=9;}
if(!ftcolor){ftcolor="Black";}
ftout(txt,x,y,w,h,size,ftcolor);
}
//主函数
function jsGraphics()
{
this.setColor=setColor;
this.setPen=setPen;
this.point=point;
this.drawLine=drawLine;
this.clear=clear;
this.drawCurve=drawCurve;
this.drawPolyline=drawPolyline;
this.drawPolygon=drawPolygon;
this.fillPolygon=fillPolygon;
this.drawEllipse=drawEllipse;
this.fillEllipse=fillEllipse;
this.pie=pie;
this.pieChart=pieChart;
this.drawStringRect=drawStringRect;
this.paint=paint;
}
//=================Tension Spline Begin==========================
//var Y=[10,20,30,40,20];
//var X=[5,10,15,20,25];
//drawCurve(X,Y,0.1);
function drawCurve(X,Y,a)
{
var M0=0.1,Mn=0.1//两个初始二次边界条件，可根据情况修改值调节两端的上凸下凸性
if(Math.abs(a)<0.005){a=0.005;}
if(Math.abs(a)>9){a=9;}
var n=X.length;
var h=new Array(n-1);
for(var i=0;i<n-1;i++){h[i]=X[i+1]-X[i];}
var K=new Array(n-2);
for(var i=1;i<n-1;i++)
{
K[i-1]=( (a*ch(a*h[i-1]))/(sh(a*h[i-1]))+(a*ch(a*h[i]))/(sh(a*h[i]))-1/h[i-1]-1/h[i] )/2;
}
var m=new Array(n-2);
for(var i=1;i<n-1;i++)
{
m[i-1]=(1/h[i]-a/(sh(a*h[i])))/(K[i-1]);
}
var l=new Array(n-2);
for(var i=1;i<n-1;i++)
{
l[i-1]=(1/h[i-1]-a/(sh(a*h[i-1])))/(K[i-1]);
}
var d=new Array(n-2);
for(var i=1;i<n-1;i++)
{
d[i-1]=a*a*((Y[i+1]-Y[i])/h[i]-(Y[i]-Y[i-1])/h[i-1])/(K[i-1]);
}
var A=new Array(n-2);
for(var i=0;i<n-2;i++)
{
A[i]=new Array(n-2);
for(var j=0;j<n-2;j++) { A[i][j]=0; }
}
for(var i=0;i<n-2;i++) { A[i][i]=2; }
for(var i=0;i<n-3;i++) { A[i][i+1]=m[i]; }
for(var i=0;i<n-3;i++) { A[i+1][i]=l[i+1]; }
d[0]=d[0]-l[0]*M0;
d[n-3]=d[n-3]-m[n-3]*Mn;
var M=Gauss(A,d);
M.unshift(M0);
M.push(Mn);
var x=X[0];
for(var j=1;j<=n-1;j++)
{
for(x=x+pen_w;x<=X[j];x=x+pen_w)
{
drawLine(x-pen_w,SH(x-pen_w,j),x,SH(x,j));
}
}
this.SH=function SH(x,j)
{
return Y[j]*(x-X[j-1])/h[j-1]+Y[j-1]*(X[j]-x)/h[j-1]-M[j]*( (x-X[j-1])*sh(a*h[j-1])/h[j-1] - sh(a*(x-X[j-1])) )/(a*a*sh(a*h[j-1])) - M[j-1]*( (X[j]-x)*sh(a*h[j-1])/h[j-1] - sh(a*(X[j]-x)) )/(a*a*sh(a*h[j-1]));
}
this.sh=function sh(x){ return (Math.exp(x)-Math.exp(-x))/2;}
this.ch=function ch(x){ return (Math.exp(x)+Math.exp(-x))/2;}
}
//按行输入矩阵A AX=b
//var A =[ [ 16, -9, 1,6 ], [-2, 1.127, 8 ,3], [ 4, 3, 1 ,2],[6,3,9,2] ];
//var b =[38,-12.873,14,9 ];
//Gauss(A,b);
function Gauss(A,b)
{
var n=A.length;
var P=new Array;
for(var i=0;i<n;i++){P[i]=i;}
var S=new Array;
for(var i=0;i<n;i++){S[i]=Max_value(A[i]);}
for(var j=0;j<n-1;j++)
{
var A_S=new Array;
for(var k=j,i=0;k<n;k++,i++)
{
A_S[i]=(A[P[k]][j])/S[P[k]];
}
var P_flag=Max_flag(A_S)+j;
var temp=P[j]; P[j]=P[P_flag];P[P_flag]=temp;
for(var i=j+1;i<n;i++)
{
A[P[i]][j]=(A[P[i]][j])/A[P[j]][j];
for(var k=j+1;k<n;k++) {A[P[i]][k]= A[P[i]][k]-(A[P[i]][j])*(A[P[j]][k]); }
}
}
for(var i=0;i<n;i++)
{
var sum=0;
for(var j=0;j<i;j++){ sum+=A[P[i]][j]*b[P[j]] ;}
b[P[i]]=b[P[i]]-sum;
}
var X=new Array(n);
for(var i=n-1;i>=0;i--)
{
var sum=0;
for(var j=i+1;j<n;j++){sum+=(A[P[i]][j])*X[j];}
X[i]=(b[P[i]]-sum)/(A[P[i]][i]);
}
return X;
this.Max_value=function Max_value(arry)
{
var temp=0;
for(var i=0;i<arry.length;i++) { if(temp<arry[i]){temp=arry[i];} }
return temp;
}
this.Max_flag=function Max_flag(arry)
{
var temp=0,flag;
for(var i=0;i<arry.length;i++) {if(temp<arry[i]){temp=arry[i];flag=i;} }
return flag;
}
}
//=================Tension Spline End==========================⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -