Zugriff auf Javascript Function eines eingebetteten SVG Files

sir.hacks.alot

Aktives Mitglied
Thread Starter
Dabei seit
10.03.2005
Beiträge
2.408
Reaktionspunkte
115
Hallo,

ich habe eine Animierte SVG Grafik erstellt, die Javascript code enthält.
Diese SVG habe ich in ein HTML Dokument eingebunden. Nun möchte ich aus dem HTML Dokument auf eine Funktion des SVG Dokuments zugreifen. Leider weiss ich nicht so recht wie ich das machen muß.

Das SVG sieht wie folgt aus:

Code:
<?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
    "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
    <!ATTLIST svg
              xmlns:a3 CDATA #IMPLIED
              a3:scriptImplementation CDATA #IMPLIED>
    <!ATTLIST script
              a3:scriptImplementation CDATA #IMPLIED>
]>
<svg onload="makeShape(evt)"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:a3="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
     a3:scriptImplementation="Adobe"
     width="1000px"
     height="400px"
     id="verzelem"
     >
    <script type="text/ecmascript" a3:scriptImplementation="Adobe"><![CDATA[
        var svgns   = "http://www.w3.org/2000/svg";
        var xlinkns = "http://www.w3.org/1999/xlink";

        function makeShape(evt) {
            if ( window.svgDocument == null )
                svgDocument = evt.target.ownerDocument;

            var svgRoot = svgDocument.documentElement;

            var defs = svgDocument.createElementNS(svgns, "defs");
            
            
            var rectDelayCell = svgDocument.createElementNS(svgns, "rect");
            rectDelayCell.setAttributeNS(null, "id", "DelayCell");
            rectDelayCell.setAttributeNS(null, "width", 50);
            rectDelayCell.setAttributeNS(null, "height", 50);
            rectDelayCell.setAttributeNS(null, "style", "fill: none; stroke: rgb(0,0,0); stroke-width: 3");
            defs.appendChild(rectDelayCell);         
            svgRoot.appendChild(defs);
...
...
...


function alarm()
            {
                alert("Alarm");
            }
...
...
...
Aus dem HTML Dokument habe ich es wie folgt probiert:

Code:
<object data="graphics/anitest.svg" type="image/svg+xml"  id="anitest"
      width="1000px" height="400px" title="Indian Office logo"> 
    <img src="graphics/example.png" width="50%" 
    alt="Indian Office logo" /> 
</object>
<script>
        var a = document.getElementById("anitest");

        //it's important to add an load event listener to the object, as it will load the svg doc asynchronously
        a.addEventListener("load",function(){
            a.alarm();
        },false);
    </script>
Das hat leider nicht funktioniert.
 
Zuletzt bearbeitet:
ich würde es mit einem iframe statt einem Objekt probieren, da hat es bei mir geklappt.
btw. hast du es mal versucht direkt zu starten anstatt mit dem onload (also JS Konsole und a.alarm() eintippen)
 
Zurück
Oben Unten