以文本方式查看主题

-  计算机科学论坛  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  求助:将多个图元组件化?  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=19377)


--  作者:turta
--  发布时间:6/8/2005 10:51:00 AM

--  求助:将多个图元组件化?
求高人指点:
如何将多个基本图元组成一个有实际意义的防真实体,用js/java文件来处理这个实体的一些动作,状态的改变等等?
--  作者:keeponline
--  发布时间:6/8/2005 1:37:00 PM

--  
用 g元素,定义ID
--  作者:keeponline
--  发布时间:6/8/2005 1:41:00 PM

--  
例如
<g id="aa">
<rect fill="rgb(1.1.255)" stroke="rgb(0.0.0)" stroke-wideth="1" x="32" y="32" width="44" height="40" />
<rect fill="rgb(1.1.255)" stroke="rgb(0.0.0)" stroke-wideth="1" x="116" y="32" width="44" height="40" />
</g>

--  作者:turta
--  发布时间:6/8/2005 2:52:00 PM

--  
我是这么做的,还使用了user—link方式。但是怎么让这样的组件动画可以程序控制(通过js接收数据调整动画)
--  作者:HainanBeibei
--  发布时间:6/17/2005 2:47:00 PM

--  
理解您的问题。难度是不是在于定义了这样的一个组合图元后,再利用这个图元创建1000个这样的对象,那我怎么能快速找到我要操作的那个对象(例如第99个对象),并根据该元件的数据来更新这个家伙的图形呢?因为GetElementByID("Obj_name")这个函数用不了了。

等高手来回答吧!


--  作者:hmilyice_angel
--  发布时间:7/5/2005 6:25:00 PM

--  

 newobj.setAttributeNS(null,"r",r);
 newobj.setAttributeNS(null,"class",classid);
 return newobj;
}

function new_text(id,text,classid,pevent){
 var tdata = svgdoc.createTextNode(text);
 var newobj = svgdoc.createElementNS(svgns, "text");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"class",classid);
 newobj.getStyle.setProperty("pointer-events",pevent);
 newobj.appendChild(tdata);
 return newobj; 
}

function new_rect(id,x,y,rx,ry,wid,hei,classid){
 var newobj=svgdoc.createElementNS(svgns,"rect");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"x",x);
 newobj.setAttributeNS(null,"y",y);
 newobj.setAttributeNS(null,"rx",rx);
 newobj.setAttributeNS(null,"ry",ry);
 newobj.setAttributeNS(null,"width",wid);
 newobj.setAttributeNS(null,"height",hei);
 newobj.setAttributeNS(null,"class",classid);
 return newobj;
}

function new_line(id,x1,y1,x2,y2,classid){
 var newobj=svgdoc.createElementNS(svgns,"line");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"x1",x1);
 newobj.setAttributeNS(null,"y1",y1);
 newobj.setAttributeNS(null,"x2",x2);
 newobj.setAttributeNS(null,"y2",y2);
 newobj.setAttributeNS(null,"class",classid);
 return newobj;
}


/**
* Draw Line
* cDis - arc center offset
* pDis - start&end point offset
*/
function new_linepath(id,classname,cDis,pDis,x1,y1,x2,y2){
  var oline=svgdoc.createElementNS(svgns,"path");

  var dx=x2-x1;
  var dy=y2-y1;
  //alert(dx + "," + dy);
  var dt=0;
  if(dx==0 && dy==0 || dx==0 && dy>0){
   dt=0;
  }
  else if(dx==0 && dy<0){
   dt=pi;
  }
  else if(dy==0 && dx>0){
   dt=pi/2;
  }
  else if(dy==0 && dx<0){
   dt=pi*3/2;
  }
  else{
   dt=Math.atan(Math.abs(dy)/Math.abs(dx));
  }
  var cx=(x1+x2)/2;
  var cy=(y1+y2)/2;
  var x1,y1,x2,y2,scx,scy;
  if(dx>0 && dy>0){
   x1=x1-pDis*tscale*Math.sin(dt);
   y1=y1+pDis*tscale*Math.cos(dt);
   x2=x2-pDis*tscale*Math.sin(dt);
   y2=y2+pDis*tscale*Math.cos(dt);

   scx=cx-cDis*tscale*Math.sin(dt);
   scy=cy+cDis*tscale*Math.cos(dt);
  }
  if(dx>0 && dy<0){
   x1=x1+pDis*tscale*Math.sin(dt);
   y1=y1+pDis*tscale*Math.cos(dt);
   x2=x2+pDis*tscale*Math.sin(dt);
   y2=y2+pDis*tscale*Math.cos(dt);
   scx=cx+cDis*tscale*Math.sin(dt);
   scy=cy+cDis*tscale*Math.cos(dt);
   //alert(Math.sin(dt) + "," + Math.cos(dt));
   //alert(scx+","+scy);
  }
  if(dx<0 && dy<0){
   x1=x1+pDis*tscale*Math.sin(dt);
   y1=y1-pDis*tscale*Math.cos(dt);
   x2=x2+pDis*tscale*Math.sin(dt);
   y2=y2-pDis*tscale*Math.cos(dt);
   scx=cx+cDis*tscale*Math.sin(dt);
   scy=cy-cDis*tscale*Math.cos(dt);
   //alert(x1+","+y1+","+x2+","+y2);
  }
  if(dx<0 && dy>0){
   x1=x1-pDis*tscale*Math.sin(dt);
   y1=y1-pDis*tscale*Math.cos(dt);
   x2=x2-pDis*tscale*Math.sin(dt);
   y2=y2-pDis*tscale*Math.cos(dt);
   scx=cx-cDis*tscale*Math.sin(dt);
   scy=cy-cDis*tscale*Math.cos(dt);
   //alert(Math.sin(dt) + "," + Math.cos(dt));
   //alert(scx+","+scy);
  }

  y1=y1*(-1);
  y2=y2*(-1);
  scy=scy*(-1);
  
  var ssss="M"+x1+","+y1+" C"+scx+","+scy+" "+scx+","+scy+" "+x2+","+y2;
  oline.setAttributeNS(null,"d",ssss);
  oline.setAttributeNS(null,"id",id);
  oline.setAttributeNS(null,"class",classname);
 return oline;
}


function new_animate(id,attName,attValue,durTime,repeatCount){
 var newobj=svgdoc.createElementNS(svgns, "animate");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"attributeName",attName);
 newobj.setAttributeNS(null,"values",attValue);
 newobj.setAttributeNS(null,"dur",durTime);
 newobj.setAttributeNS(null,"repeatCount",repeatCount);
 return newobj;
}

function new_link(id,href){
 var newobj = svgdoc.createElementNS(svgns, id);
 newobj.setAttributeNS(xlinkns, "xlink:href", href);
 return newobj;
}

function new_use(id,x,y){
 var newobj=svgdoc.createElementNS(svgns,"use");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"x",x);
 newobj.setAttributeNS(null,"y",y);
 //newobj.setAttributeNS(null,"width",10);
 //newobj.setAttributeNS(null,"height",10);
 return newobj;
}

function new_image(id,x,y,wid,hei,href){
 var newobj=svgdoc.createElementNS(svgns,"image");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"x",x);
 newobj.setAttributeNS(null,"y",y);
 newobj.setAttributeNS(null,"width",wid);
 newobj.setAttributeNS(null,"height",hei);
 newobj.setAttributeNS(xlinkns, "xlink:href", href);
 return newobj;
}

function new_tspan(id,fillcolor){
 var newobj=svgdoc.createElementNS(svgns,"tspan");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"fill",fillcolor);
 return newobj;
}


--  作者:hmilyice_angel
--  发布时间:7/5/2005 6:28:00 PM

--  
前面少了的代码
function new_group(id){
 var newobj=svgdoc.createElementNS(svgns,"g");
 newobj.setAttributeNS(null,"id",id);
 return newobj;
}

function new_circle(id,x,y,r,classid){
 var newobj=svgdoc.createElementNS(svgns,"circle");
 newobj.setAttributeNS(null,"id",id);
 newobj.setAttributeNS(null,"cx",x);
 newobj.setAttributeNS(null,"cy",y);
 newobj.setAttributeNS(null,"r",r);
 newobj.setAttributeNS(null,"class",classid);
 return newobj;
}


--  作者:turta
--  发布时间:8/11/2005 9:27:00 PM

--  
我的初衷是想将这些东西都封装在javaBean里面~!
通过jdom 动态的修改svgdocument!
这样就达到了比较好的组件的目的!
而且重用性将大大提高!
欢迎有见地的朋友高谈阔论!
在下正酝酿之中
W 3 C h i n a ( since 2003 ) 旗 下 站 点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》
46.875ms