园与线的拖动02

最新推荐文章于 2024-09-14 18:52:56 发布

-布谷鸟-

最新推荐文章于 2024-09-14 18:52:56 发布

阅读量1k

点赞数

文章标签： function behavior textbox javascript border url

本文链接：https://blog.csdn.net/cuckoo1/article/details/1722500

版权

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=GB2312">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<style>
v/:* {behavior:url(#default#VML);}
o/:* {behavior:url(#default#VML);}
x/:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<style>

</style>
<script language=javascript>
var menuskin=1
var display_url=0
function point(x0,y0)
{
this.x = x0;
this.y = y0;
this.r = Math.sqrt(this.x*this.x+this.y*this.y);
var alfa = Math.acos(this.x/this.r);
if (this.y >= 0) {
    alfa = alfa;
} else {
    alfa = 2*Math.PI-alfa;
}
this.alfaR = alfa;
this.alfaD = alfa*180/Math.PI;
}
function line1(id,from,to,strokeweight,strokecolor,dashstyle,arrow1,arrow2) {
this.id = id;
this.from = from;
this.to = to;
if (strokeweight==undefined)
{
    strokeweight = "1";
}
if (strokecolor==undefined)
{
    strokecolor = "#00F";
}
if (dashstyle==undefined)
{
    dashstyle = "solid";
}
if (arrow1==undefined)
{
    arrow1 = "";
}
if (arrow2==undefined)
{
    arrow2 = "block";
}
this.strokeweight = strokeweight;
this.strokecolor = strokecolor;
this.dashstyle = dashstyle;
this.startarrow = arrow1;
this.endarrow = arrow2;
this.length = getlinelen;
this.draw = drawline;
}
function getlinelen()
{
if ((this.from.x == this.to.x) && (this.from.y == this.to.y))
{
    return 0;
} else
{
    return Math.sqrt((this.from.x-this.to.x)*(this.from.x-this.to.x)+(this.from.y-this.to.y)*(this.from.y-this.to.y));
}
}
function get2plen(p1,p2)
{
if ((p1.x == p2.x) && (p1.y == p2.y))
{
    return 0;
} else
{
    return Math.sqrt((p1.x-p2.x)*(p1.x-p2.x)+(p1.y-p2.y)*(p1.y-p2.y));
}
}
function drawline()
{
var str = "";
str = str +"<v:line id="+this.id+" class='line' style='position:absolute;left:0px;top:0px;' ";
str = str +" οnmοusedοwn='downL(this);'";
str = str +" from='"+this.from.x+"px,"+this.from.y+"px'";
str = str +" to='"+ this.to.x +"px,"+ this.to.y +"px' ";
str = str +" strokeweight='"+this.strokeweight+"px;' strokecolor='"+this.strokecolor+"'> ";
str = str +" <v:stroke dashstyle='"+this.dashstyle+"' startarrow='"+this.startarrow+"' endarrow='"+this.endarrow+"' /> ";
str = str +"</v:line>";
document.write(str);
}
function getcontinuecolor(bgnclr)
{
var vclr = parseInt(bgnclr.substr(1,3),16);
vclr += 4;
var s = "000"+vclr.toString(16);
var l = s.length-3;
window.status=bgnclr.substr(1,3)+"saaaaaaato='"+vclr+";"+s.substr(l,3);
return "#"+s.substr(l,3);
}
function getrandomcolor()
{
var r1,r2,r3;
r1=Math.round((Math.random()*256));
r2=Math.round((Math.random()*256));
r3=Math.round((Math.random()*256));
return "#"+ prefixzero(r1.toString(16))+
        prefixzero(r2.toString(16))+
        prefixzero(r3.toString(16));
}
function prefixzero(strg)
{
var slen=strg.length;
strg = (slen==1)?("0"+strg):(strg);
return strg;
}
function angle(Deg)
{
this.Degree = Deg*180 / Math.PI;
this.Radian = Deg*Math.PI / 180;
}
function RotPnt(p1,alfa1)
{
x2 = p1.x * Math.cos(alfa1) - p1.y * Math.sin(alfa1);
y2 = p1.x * Math.sin(alfa1) + p1.y * Math.cos(alfa1);
return new point(x2,y2);
}
function shiftp(p1,p2) {
return new point((p1.x + p2.x),(p1.y + p2.y));
}
function ellipsering(id,x0,y0,ra,rb,filled,fillcolor,stroked,strokecolor,strokeweight,rotation,txt)
{
var left,top,width,height
var str = "";
left = x0-ra;
top = y0-rb
width = 2*ra;
height = 2*rb;
str = str +"<v:oval id="+id+" class='oval' ";
str = str +" style='position:absolute; ";
str = str +" left:"+left+";top:"+top+";width:"+width+";height:"+height+"; ";
str = str +" rotation:"+rotation+"fd;z-index:1' ";
str = str +" οnmοusedοwn='downO(this);' ";
str = str +" filled='"+filled+"' fillcolor="+fillcolor+" stroked='"+stroked+"' strokecolor="+strokecolor+" ";
str = str +" strokeweight="+strokeweight+"> ";
str = str +" <v:stroke dashstyle='solid'/>";
str = str +" <v:TextBox inset='0,0,0,0'><p style='color:#FFFFFF;font-size:12;' align=center>"+txt+"</p></v:TextBox>";
str = str +"</v:oval>";
document.write(str);
}
function DisPnt(a,b,R)
{
var R0 = new point(R,0);
var ab = new point(b.x-a.x,b.y-a.y);
var a0 = new RotPnt(R0,ab.alfaR);
var a1 = new shiftp(a0,a);
return a1;
}
function Line2Cir(id,a,b,R,clr)
{
a1 = new DisPnt(a,b,R);
b1 = new DisPnt(b,a,R);
var lab1 = new line1(id,a1,b1,1,clr);
lab1.draw();
return;
}
var originx0 = screen.availWidth/2 - 20;
var originy0 = screen.availHeight/2 - 100;
var originz0 = 0;
var OrigPnt0 = new point(originx0,originy0);
</SCRIPT>
</head>
<body scroll=yes
style="font-family: 宋体; font-style: italic; font-size:11pt;background-color: #ffffff; color:#0000FF"
οnmοusemοve="move();"
οnmοuseup="down=false;"
οncοntextmenu="window.event.returnValue=false"
οnselect="document.selection.empty()">
1,通过JAVASCRIPT实现线移动。以屏幕中心为坐标原点(按F11让屏幕最大化)。(谷来成，2007.8.1)<br>
2,线为有向线条<br>
3,线为单点移动<br>
4,节点园有半径<br>
5,线的端点绕园移动(以园心为起点)<br>
<script>
R = 12;
var a = new point(originx0-400,originy0);
var b = new point(a.x,a.y+150);
var c = new point(a.x+150,a.y);
var d = new point(a.x+150,a.y+150);
var e = new point(a.x+300,a.y);
var f = new point(a.x+300,a.y+150);
ellipsering("ca",a.x,a.y,R ,R ,"t","#E00FF0","t","#FF0000",-1,"0,0","A");
ellipsering("cb",b.x,b.y,R ,R ,"t","#0DD000","t","#FF0000",-1,"0,0","B");
Line2Cir("l_ab",a,b,R,"#07F");
Line2Cir("l_bc",b,c,R,"#70F");
Line2Cir("l_cd",c,d,R,"#F7F");
Line2Cir("l_ac",a,c,R,"#55F");
Line2Cir("l_ad",a,d,R,"#55F");
Line2Cir("l_bd",b,d,R,"#55F");
var over=false,down=false,oLeft,oTop,o;
var l1,l2;
function downO(m)
{
o=m;
down=true;
oLeft = event.clientX-parseFloat(o.style.left);
oTop = event.clientY-parseFloat(o.style.top)
window.status=""+oLeft+","+oTop+"    Class:"+o.className;
}
function downL(m)
{
o=m;
down=true;
oLeft = event.clientX;
oTop = event.clientY;
var FromP = new point(o.from.x,o.from.y);
var ToP    = new point(o.to.x,o.to.y);
var Cpnt = new point(event.clientX,event.clientY);
l1 = get2plen(FromP,Cpnt);
l2 = get2plen(ToP,Cpnt);
    window.status="C:"+Cpnt.x+","+Cpnt.y+" , F:"+FromP.x+","+FromP.y+" T:"+ToP.x+","+ToP.y;
}
function move()
{
if(down)
{
    if (o.className=="line") {
a0 = new point(parseFloat(ca.style.left)+parseFloat(ca.style.width)/2.0,
          parseFloat(ca.style.top)+parseFloat(ca.style.height)/2.0);
b0 = new point(parseFloat(cb.style.left)+parseFloat(cb.style.width)/2.0,
          parseFloat(cb.style.top)+parseFloat(cb.style.height)/2.0);
c0 = new point(event.clientX,event.clientY);
    window.status="L:"+ l1 +","+ l2+" , a0:"+a0.x+","+a0.y+" b0:"+b0.x+","+b0.y;
      if (l1 <= l2) {
        b1 = new DisPnt(b0,c0,R);
        o.from = "'"+event.clientX+"px,"+event.clientY+"px'";
        o.to = "'"+b1.x+","+b1.y+"'";
      } else {
        a1 = new DisPnt(a0,c0,R);
        o.from = "'"+a1.x+","+a1.y+"'";
        o.to = "'"+event.clientX+"px,"+event.clientY+"px'";
      }
    } else {
      o.style.left = event.clientX-oLeft;
      o.style.top    = event.clientY-oTop;
if (o.id == "ca")
{
a0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
b0 = new point(parseFloat(cb.style.left)+parseFloat(cb.style.width)/2.0,
          parseFloat(cb.style.top)+parseFloat(cb.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_ab.from = "'"+a1.x+","+a1.y+"'";
l_ab.to    = "'"+b1.x+","+b1.y+"'";
a0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
b0 = new point(parseFloat(cc.style.left)+parseFloat(cc.style.width)/2.0,
          parseFloat(cc.style.top)+parseFloat(cc.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_ac.from = "'"+a1.x+","+a1.y+"'";
l_ac.to    = "'"+b1.x+","+b1.y+"'";
} else if (o.id == "cb")
{
a0 = new point(parseFloat(ca.style.left)+parseFloat(ca.style.width)/2.0,
          parseFloat(ca.style.top)+parseFloat(ca.style.height)/2.0);
b0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_ab.from = "'"+a1.x+","+a1.y+"'";
l_ab.to    = "'"+b1.x+","+b1.y+"'";
a0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
b0 = new point(parseFloat(cc.style.left)+parseFloat(cc.style.width)/2.0,
          parseFloat(cc.style.top)+parseFloat(cc.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_bc.from = "'"+a1.x+","+a1.y+"'";
l_bc.to    = "'"+b1.x+","+b1.y+"'";
} else if (o.id == "cc")
{
a0 = new point(parseFloat(ca.style.left)+parseFloat(ca.style.width)/2.0,
          parseFloat(ca.style.top)+parseFloat(ca.style.height)/2.0);
b0 =new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_ac.from = "'"+a1.x+","+a1.y+"'";
l_ac.to    = "'"+b1.x+","+b1.y+"'";
a0 = new point(parseFloat(cb.style.left)+parseFloat(cb.style.width)/2.0,
          parseFloat(cb.style.top)+parseFloat(cb.style.height)/2.0);
b0 =new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_bc.from = "'"+a1.x+","+a1.y+"'";
l_bc.to    = "'"+b1.x+","+b1.y+"'";
a0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
b0 = new point(parseFloat(cd.style.left)+parseFloat(cd.style.width)/2.0,
          parseFloat(cd.style.top)+parseFloat(cd.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_cd.from = "'"+a1.x+","+a1.y+"'";
l_cd.to    = "'"+b1.x+","+b1.y+"'";
} else if (o.id == "cd")
{
a0 = new point(parseFloat(cc.style.left)+parseFloat(cc.style.width)/2.0,
          parseFloat(cc.style.top)+parseFloat(cc.style.height)/2.0);
b0 = new point(parseFloat(o.style.left)+parseFloat(o.style.width)/2.0,
          parseFloat(o.style.top)+parseFloat(o.style.height)/2.0);
a1 = new DisPnt(a0,b0,R);
b1 = new DisPnt(b0,a0,R);
l_cd.from = "'"+a1.x+","+a1.y+"'";
l_cd.to    = "'"+b1.x+","+b1.y+"'";
} else
{
}
    window.status=""+o.style.left+","+o.style.top + " " +o.id +"===="+l_ab.from +" " +l_ab.to;
    }
}
}
</script>
</body>
</html>