以文本方式查看主题

-  计算机科学论坛  (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=37054)


--  作者:xfecczgh
--  发布时间:8/21/2006 4:17:00 PM

--  请教两个问题
1、在《基于XML的SVG应用指南》中说,在使用动画时,begin属性可以使用绝对时间,请问怎么使用?
2、路径中怎样描述子路径

--  作者:xfecczgh
--  发布时间:8/22/2006 9:14:00 AM

--  
绝对时间的问题已经解决. begin="wallclock(2006-08-22T10:10:00)"
意思是2006年8月22日10时10分开始执行.
但是,我测试时,它并没有运动, 为什么?
--  作者:xfecczgh
--  发布时间:8/23/2006 9:39:00 AM

--  
在learn by code上有一个绝对时间的例子, 为什么红色的圆不运动?

<?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
  "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
  <!ATTLIST svg xmlns:xlink CDATA #FIXED "http://www.w3.org/1999/xlink">
]>

<!-- SVG - Learning By Coding - http://www.datenverdrahten.de/svglbc/ -->
<!--    Author: Dr. Thomas Meinike 06/05 - thomas@handmadecode.de     -->

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  onload="Init(evt)">

  <title>SVG - Learning By Coding</title>
  <desc>SVG-Spezifikation in Beispielen</desc>

  <defs>

    <script type="text/javascript">
      <![CDATA[

      function Init(load_evt)
      {
        var svgdoc,lz,sz,kr,an,nd,udutc,ndutc_plus10s,wc,
            svgns="http://www.w3.org/2000/svg";

        // SVG-Objekte zuweisen
        svgdoc=load_evt.target.ownerDocument;
        lz=svgdoc.getElementById("ladezeit");
        sz=svgdoc.getElementById("startzeit");
        kr1=svgdoc.getElementById("kreis1");
        kr2=svgdoc.getElementById("kreis2");

        // Informationen zu Datum/Zeit abfragen
        nd=new Date();
        ndutc=getUTCDateTime(nd);
        ndutc_plus10s=getUTCDateTime(new Date(nd.getTime()+10000));
        wc="wallclock("+ndutc_plus10s+")";

        // Textausgaben
        lz.firstChild.nodeValue+=ndutc;
        sz.firstChild.nodeValue+="Ladezeit + 10s = "+wc;

        // Animation fuer Kreis 1 mit begin="10s" erzeugen
        an=svgdoc.createElementNS(svgns,"animate");
        an.setAttribute("attributeName","cx");
        an.setAttribute("attributeType","XML");
        an.setAttribute("begin","10s");
        an.setAttribute("dur","10s");
        an.setAttribute("from","50");
        an.setAttribute("to","430");
        an.setAttribute("fill","freeze");
        kr1.appendChild(an);

        // Animation fuer Kreis 2 in mit begin="wallclock(...)" erzeugen
        an=svgdoc.createElementNS(svgns,"animate");
        an.setAttribute("attributeName","cx");
        an.setAttribute("attributeType","XML");
        an.setAttribute("begin",wc);
        an.setAttribute("dur","10");
        an.setAttribute("from","50");
        an.setAttribute("to","430");
        an.setAttribute("fill","freeze");
        kr2.appendChild(an);
      }


      function getUTCDateTime(dt)
      {
        var dd,mm,yyyy,hh,mi,ss;

        dd=dt.getUTCDate();
        dd=(dd<10)?"0"+dd:dd;
        mm=dt.getUTCMonth()+1;
        mm=(mm<10)?"0"+mm:mm;
        yyyy=dt.getUTCFullYear();
        hh=dt.getUTCHours();
        hh=(hh<10)?"0"+hh:hh;
        mi=dt.getUTCMinutes();
        mi=(mi<10)?"0"+mi:mi;
        ss=dt.getUTCSeconds();
        ss=(ss<10)?"0"+ss:ss;

        // UTC-Format YYYY-MM-DDThh:mm:ssZ erzeugen
        return yyyy+"-"+mm+"-"+dd+"T"+hh+":"+mi+":"+ss+"Z";
      }


      function AnimInfo(click_evt)
      {
        if(printNode)alert("Erzeugtes animate-Element:\n\n"+
           printNode(click_evt.target.firstChild));
        else alert("printNode()-Methode nicht verfuegbar.");
      }

      ]]>
    </script>

  </defs>

  <text x="20" y="30" style="font-size: 24px">
    Wallclock-Synchronisation mit UTC-Zeitwerten nach ISO 8601</text>

  <text x="30" y="55" style="font-size: 12px; fill: #000">
    Beide Kreise sollten sich nach 10s in Bewegung setzen: der gr黱e mit
    begin=&quot;10s&quot;, der rote mit begin=&quot;wallclock(...)&quot;.</text>
  <text id="ladezeit" x="30" y="80"
    style="font-size: 14px; fill: #00C">Ladezeit (UTC): </text>
  <text id="startzeit" x="30" y="100"
    style="font-size: 14px; fill: #F00">Startzeit (UTC): </text>
  <text x="30" y="260" style="font-size: 12px; fill: #000">
    Zur Abfrage von Details zu den erzeugten animate-Elementen
    Kreise anklicken!</text>

  <circle id="kreis1" cx="50" cy="150" r="20" fill="#090" onclick="AnimInfo(evt)"/>
  <circle id="kreis2" cx="50" cy="210" r="20" fill="#F00" onclick="AnimInfo(evt)"/>

</svg>


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