以文本方式查看主题

-  中文XML论坛 - 专业的XML技术讨论区  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  紧急求助：在JSP里调用SVG的脚本  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=19213)

--  作者：犬神狼
--  发布时间：6/4/2005 9:51:00 AM

--  紧急求助：在JSP里调用SVG的脚本
我在JSP里嵌入了SVG地图，试图通过把JSP读数据库后返回的数据显示在SVG图中，但是在调用相应的SVG脚本函数是发生了奇怪的问题：

Result.jsp
<html>
<head>
<title>JSP</title>

<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">

function f1(str）
{
    window.setStr(str);
}   
function f2(str)
{   alert(str); }
function f3(str） {
   var s1=str;
   
  }
</script>
</head>

<BODY background="images/bg_main.gif" leftmargin="15" topmargin="0" marginwidth="0" marginheight="0">

<% int len=10;    
   String[] univ=new String[len];
   int[] num=new int[len];
   int count=0;
   univ[0]="Massachusetts Institute of Technology";
   univ[1]="Stanford University";
   univ[2]="UC Berkeley";
   univ[3]="Carnegie Mellon University";
   univ[4]="University of Illinois at Urbana-Champaign";
   univ[5]="California Institute of Technology";
   univ[6]="University of Michigan";
   univ[7]="Cornell University";
   univ[8]="Princeton University";
   univ[9]="Purdue University";
   %>

<%@ page contentType="text/html;charset=GB2312"
   language="java" import="java.sql.*" %>
<%   

   Connection con=null;
  String tableName="researchers"+year;
   for(int i=0;i<len;i++)
    {
     try{
     Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
  con=DriverManager.getConnection("jdbc:odbc:researchEyes");
  Statement statement=con.createStatement();
        
  ResultSet rs=statement.executeQuery("select count(researcherName)as coun from domainRe , " + tableName + " where domainRe.domain =" + tableName +".domain and " + tableName + ".university='" + univ[i] + "' and ( domainRe.level2='" + domain + "' or domainRe.level1='" + domain + "' or domainRe.domain='" + domain + "' )");
  
   for(int j=0;rs.next();j++) 
     {
        num[i]=rs.getInt("coun");
        count=count+num[i];
    }
  rs.close();
  con.close();
   }
 catch (Exception e)
    {
  out.println(e.getMessage());
    }
 if(num[i]!=0)
    out.println("<p class='style1'>"+univ[i]+" : "+"<span class='style2'>"+num[i]+"</span></p>");
 }  
 
    %>

<input id="zoomIn" type="button"  value="zoomIn" onclick="f1(id)" >
<input id="zoomOut" type="button"  value="zoomOut" onclick="f1(id)" >
<embed width="900" height="700" name="picture" PLUGINSPAGE="http://www.adobe.com/svg/viewer/install/"
            src="mapScript.svg" type="image/svg+xml">

<%for(int k=0;k<len;k++)
 {  
   if(num[k]!=0){%>
   <script language="JavaScript">  
      var s1="<%=univ[k]%>";
      var s2=<%=num[k]%>;
     window.setCir(s1,s2);
  </script>
 <%}}%>
</body>
</html>

mapScript.svg

<svg width="900" height="650" viewBox="(0,0,900,650)" onload="init(evt)">
<script type="text/ecmascript"> <![CDATA[
    var a=1;
    var choice=-1;
   function init(event)
    {
       //target = event.getTarget();
       //svgDocument = target.getOwnerDocument();
     parent.setStr=svgSetstr;
     parent.setCir=svgSetcilcle;     
   }
   function svgSetstr(str)
  {
        if(str=="zoomIn") {choice=1;return;}
      if(str=="zoomOut") {choice=0;}
  
   }

   function svgSetcilcle(s1,s2)
   {
     
     var cirB=svgDocument.getElementById(s1+"b");
     var cirR1=svgDocument.getElementById(s1+"r");
     var cirR2=svgDocument.getElementById(s1+"w");
     cirB.setAttribute("visibility","hidden");
    
     var a=s2/2.5+2.3;
     
     if(a>20) {a=16; }
     var b=a/2.8;
     var curx=cirR2.getAttribute("cx");
     var cury=cirR2.getAttribute("cy");
   
     cirR1.setAttribute("r",a);
     cirR2.setAttribute("r",b);
     cirR2.setAttribute("cx",curx-a/2.8);
     cirR2.setAttribute("cy",cury-a/2.8);

   }
        
   function mouseClick2(event)
    {
         var ellipse = event.target;
        var currrentid=ellipse.getAttribute("id");
        parent.f2(currentid);
     }
]]> </script>
</svg>
请问是不是可以把SVG的脚本直接写在JSP里面，或者还有其他的能直接调用SVG脚本函数的方法？

--  作者：caoxy
--  发布时间：6/4/2005 5:25:00 PM

--  
利用SVG的DOM接口和javascript就可以的。
--  作者：犬神狼
--  发布时间：6/4/2005 6:29:00 PM

--  
可是我的代码在调用SVG脚本的时候会出错啊。
<%for(int k=0;k<len;k++)
{  
   if(num[k]!=0){%>
   <script language="javascript">  
      var s1="<%=univ[k]%>";
      var s2=<%=num[k]%>;
     window.setCir(s1,s2); //这句用来调SVG脚本的时候就会报错，到底为什么啊？
  </script>
<%}}%>
--  作者：sunlice
--  发布时间：6/8/2005 5:16:00 PM

--  
错误是什么？贴上来看看。
你不用把 parent.setStr=svgSetstr;
     parent.setCir=svgSetcilcle;
放在init中 直接写出来就行了。
--  作者：犬神狼
--  发布时间：6/9/2005 9:34:00 AM

--  
错误是不支持此属性或方法。
我在SVG的初始时就令 parent.setStr=svgSetstr;
                              parent.setCir=svgSetcilcle;
是为了把HTML的setStr函数与SVG的svgSetstr函数关联起来，这样才可以实现HTML对SVG脚本的调用。
     不然HTML要怎么调用SVG本身的脚本函数呢？
--  作者：sunlice
--  发布时间：6/9/2005 3:53:00 PM

--  
楼主可能没有理解我的意思，我的意思是不把
parent.setStr=svgSetstr;
parent.setCir=svgSetcilcle;
放在你的初始化函数里面。
因为涉及到变量的作用域和初始化时间的问题。
所以需要把
parent.setStr=svgSetstr;
parent.setCir=svgSetcilcle;
作为全局的变量声明。
就是
var a=1;
    var choice=-1;
     parent.setStr=svgSetstr;
     parent.setCir=svgSetcilcle;     
   function init(event)
    {
       //target = event.getTarget();
       //svgDocument = target.getOwnerDocument();

   }

--  作者：犬神狼
--  发布时间：6/9/2005 8:04:00 PM

--  
这样啊，谢谢了，我试试先
--  作者：wulemale
--  发布时间：6/14/2005 9:09:00 PM

--  
你这个SVG没有id居然也能调用？
--  作者：犬神狼
--  发布时间：6/14/2005 10:12:00 PM

--  
恩，因为并不是直接通过JSP的脚本来访问SVG的元素，所以在JSP中不需要通过SVG的ID来获得SVGDocument。
--  作者：wulemale
--  发布时间：6/15/2005 8:46:00 AM

--  
window.setCir(s1,s2);--调用的是哪一个方法？
你调试通过了吗，源代码帖出来吧，谢谢！
--  作者：犬神狼
--  发布时间：6/15/2005 10:42:00 AM

--  
已经调试通过了。
window.setCir(s1,s2)调用的是svgSetcilcle(s1,s2)，就是用HTML中的脚本调用了SVG的脚本，目的是把s1，s2两个参数传递给SVG。
直接在SVG的init中建立HTML与SVG的脚本函数关联就可以：
function init(event)
    {
       target = event.getTarget();
       svgDocument = target.getOwnerDocument();
     parent.setStr=svgSetstr; //HTML的setSt关联为SVG的svgSetstr函数
     parent.setCir=svgSetcilcle;     
   }

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