dynamic update of , workaround problem

["Barbisch, Martin" <ba...@sony.de>]

Hello,

I would like to have a <use> element which references an <image> which is
defined in the <defs> section. If the image is clicked, the <use> element
should be changed to display another image. Since I am aware of the fact
that dynamic updates are not possible with all elements yet, I tried to
replace the <use> element by a new one.
Even though the DOM tree reflects the change, the new image is not
displayed.

Does anybody know what is wrong?

Thanks,

Martin

[Batik 1.5beta4b, Windows 2000]


-------------------------------------------------------------------

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">

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

    var XLINKNS = "http://www.w3.org/1999/xlink";
    var SVGNS   = "http://www.w3.org/2000/svg";

    function toggleButton() {

        var use = document.getElementById("ImageButton");
        var par = use.getParentNode();

        var im  = use.getAttributeNS(XLINKNS, "href");
        var nim = (im == "#ButtonLeft") ? "#ButtonRight"
                                        : "#ButtonLeft";

        var use2 = document.createElementNS(SVGNS, "use");
        use2.setAttribute("id", "ImageButton");
        use2.setAttributeNS(XLINKNS, "href", nim);

        par.replaceChild(use2, use);
    }

  ]]></script>


  <defs>

    <image id="ButtonLeft"  xlink:href="ButtonLeft.png"
           width="51" height="148" />
    <image id="ButtonRight" xlink:href="ButtonRight.png"
           width="51" height="148" />

  </defs>


  <a onclick="toggleButton()">
    <use id="ImageButton" xlink:href="#ButtonLeft" />
  </a>

</svg>

-------------------------------------------------------------------

---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
For additional commands, e-mail: batik-users-help@xml.apache.org