以文本方式查看主题

-  中文XML论坛 - 专业的XML技术讨论区  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  有没有朋友搞过SVG的图形移动???  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=15369)


--  作者:moonsky731
--  发布时间:3/11/2005 10:17:00 AM

--  有没有朋友搞过SVG的图形移动???
大家都知道,在html的Embed长宽大小是固定的,我用ZoomIn把图像放大后,一般viewer会默认看到的是原图左上角的一部分,这样其他部分就看不到,大家有没有写过类似的JS来控制放大后图形的托拽????就像ACDSee那样,一个图形如果太大,可以通过手型光标托拽??????
--  作者:edison1024
--  发布时间:3/12/2005 10:49:00 AM

--  
用viewbox就可以了。具体自己去查吧。
--  作者:SCYANGYU
--  发布时间:3/14/2005 8:00:00 AM

--  
论坛中前面有一个例子,大家可以看看!
--  作者:molester
--  发布时间:3/22/2005 11:14:00 AM

--  
拖动的话,你去记录屏幕坐标的变化,然后换算成绝对坐标的变化,修改viewbox就可以了
--  作者:mi9
--  发布时间:3/29/2005 9:47:00 AM

--  
以下是引用molester在2005-3-22 11:14:16的发言:
拖动的话,你去记录屏幕坐标的变化,然后换算成绝对坐标的变化,修改viewbox就可以了


那具体的转换思路是什么呢?透露一下吧
--  作者:henrybenben
--  发布时间:4/13/2005 10:45:00 PM

--  
setCurrentRoom();
} // end function Initialize()

function setCurrentRoom(){

   viewBox = SVGRoot.getAttribute('viewBox');
   var viewVals = viewBox.split(' ');
   currentPosition = parseFloat(viewVals[0]);

   if (currentPosition % 400 != 0) {
      currentRoomId = null;
      currentRoomLabel = "None.  Please scroll to desired room.";
   } else if (currentPosition / 400 == 0) {
      currentRoomId = "Room102";
      currentRoomLabel = "Room 102";
   } else if (currentPosition / 400 == -1) {
      currentRoomId = "Room101";
      currentRoomLabel = "Room 101";
   } else if (currentPosition / 400 == 1) {
      currentRoomId = "Room103";
      currentRoomLabel = "Room 103";
   }
document.getElementById("currentRoom").innerHTML = currentRoomLabel;

}
//panDoc() 函数控制向左和向右滚动:
function panDoc(evt){

//   currentPosition = parseFloat(viewVals[0]);
if (goLeft == true){
      if (currentPosition > -400) {
          currentPosition = currentPosition - 200;
      }
      goLeft = false;
   }

   if (goRight == true){
     if (currentPosition < 400) {
          currentPosition = currentPosition + 200;
     }
     goRight = false;
   }
viewBox = SVGRoot.getAttribute('viewBox');
   var viewVals = viewBox.split(' ');

   viewVals[0] = currentPosition;
   SVGRoot.setAttribute('viewBox', viewVals.join(' '));

setCurrentRoom();
} // end function panDoc()

function toExec(){

   if (currentRoomId == null) {

      alert("Ambiguous room position! \n Please align a room "+
         "precisely before attempting to change room type.");

   } else {

      SVGDoc.getElementById(currentRoomId+"Rect")
                                      .setAttribute("fill", "#FF0000");

      innerSVG = SVGDoc.getElementById(currentRoomId);

      oldChild = SVGDoc.getElementById(currentRoomId+"Label");
      innerSVG.removeChild(oldChild);

      oldChild = SVGDoc.getElementById(currentRoomId+"Type");
      innerSVG.removeChild(oldChild);
myData = SVGDoc.createTextNode("Executive Office");
      newText = SVGDoc.createElementNS(svgns, "text");
      newText.setAttributeNS(null, "id", currentRoomId+"Type");
      newText.setAttributeNS(null, "x", "55px");
      newText.setAttributeNS(null, "y", "100px");
      newText.setAttributeNS(null, "font-size", "24pt");
      newText.setAttributeNS(null, "stroke", "white");
      newText.appendChild(myData);
      SVGDoc.getElementById(currentRoomId).appendChild(newText);

      myData = SVGDoc.createTextNode(currentRoomLabel);
      newText = SVGDoc.createElementNS(svgns, "text");
      newText.setAttributeNS(null, "id", currentRoomId+"Label");
      newText.setAttributeNS(null, "x", "55px");
      newText.setAttributeNS(null, "y", "150px");
      newText.setAttributeNS(null, "font-size", "24pt");
      newText.setAttributeNS(null, "stroke", "white");
      newText.appendChild(myData);
      SVGDoc.getElementById(currentRoomId).appendChild(newText);

   }

} // end function toExec()
试试这几个函数,我用得可以


W 3 C h i n a ( since 2003 ) 旗 下 站 点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》
53.711ms