Eigenschaften width und height eines SVG in JavaScript
Hadi
- javascript
0 Thomas Meinike0 Hadi0 Thomas Meinike0 Hadi0 Thomas Meinike0 Hadi
Hallo Welt !
Folgende Sachlage:
In einer HTML Seite wird via
<object id="svg" data="svg_graph.asp" type="image/svg+xml"><img src="graph.asp" id="png" alt="SVG Ersatz"></object>
ein SVG eingebunden.
"svg_graph.asp" liefert dynamisch ein SVG zurück, alternativ wird von "graph.asp" ein PNG Bild erzeugt, falls kein SVG angezeigt werden kann. Das funktioniert auch wunderbar.
Problem dabei: Die Größe des SVG ist unterschiedlich groß und so kann ich keine festen Angaben width und height in das Object Tag schreiben.
Eine Suche über Google und im Archiv ( http://forum.de.selfhtml.org/archiv/2003/3/39506/ ) ergab, das meine anfängliche Idee, das Element nachträglich mit JavaScript anzupassen, nicht so falsch war. Leider sind die Hilfen zum Lösungsansatz noch nicht bis zu mir durchgedrungen und/oder ich verstehe sie dort nicht ganz.
Mein Versuch: Ich greife mit svgobj = document.getElementById("svg").getSVGDocument(); auf das Element zu.
So weit, so gut. Nun meine Frage:
Wie komme ich nun an die im SVG angegebenen Größen Angaben ?
svgobj.width oder svgobj.height liefert "undefinied" zurück. Wenn ich das object Element selber mit svgobj = document.getElementById("svg") angebe, bekomme ich mit svgobj.width gar nichts zurück.
Vielen Dank für ggf. enstehende Bemühungen ... !
mfg
HADI
---
ss:| zu:) ls:& fo:| de:] va:) ch:? sh:) n4:~ rl:° br:> js:| ie:{ fl:| mo:}
Hallo,
Mein Versuch: Ich greife mit svgobj = document.getElementById("svg").getSVGDocument(); auf das Element zu.
So weit, so gut. Nun meine Frage:
Wie komme ich nun an die im SVG angegebenen Größen Angaben ?svgobj.width oder svgobj.height liefert "undefinied" zurück. Wenn ich das object Element selber mit svgobj = document.getElementById("svg") angebe, bekomme ich mit svgobj.width gar nichts zurück.
1. ueber das window-Objekt des SVG-Containers:
svgobj1 = document.getElementById("svg");
w = svgobj1.window.innerWidth;
h = svgobj1.window.innerHeight;
2. durch direkte Abfrage der (gesetzten) Attribute aus dem svg-Wurzelelement:
svgobj2 = document.getElementById("svg").getSVGDocument();
w = svgobj2.rootElement.getAttribute("width");
h = svgobj2.rootElement.getAttribute("height");
BTW: Mit object gibt es aber Probleme beim Uebergang vom HTML- zum SVG-Script-Kontext embed und iframe sind da handlicher, siehe: http://svglbc.datenverdrahten.de/embed_object_iframe.htm.
MfG, Thomas
Hallo !
Erstmal Danke für den Lösungsansatz.
Irgendwie scheint es bei mir noch nicht so zu klappen wie ich will.
Habe beide Varianten probiert (jeweils ein object tag mit id="svg"):
w = svgobj.window.innerWidth;
h = svgobj.window.innerHeight;
Fehlermeldung : 'svgobj.window.innerWidth' is null or not an object
w = svgobj.rootElement.getAttribute("width");
h = svgobj.rootElement.getAttribute("height");
Fehlermeldung: Unspecified Error (Unbekannte Ausnahme)
Eine Änderung des Tag in embed sowie die Beispiele auf der angegeben Seite brachten fast genau die selben Fehlermeldungen, nur war es hier 'obj.window.document'
Dazu verwendet wird übrigens IE 6 + SVG Viewer 2.0.
Da aber embed und iframe nicht zum HTML Standard gehört, würde ich wenn möglich gerne drauf verzichten.
Die zweite Variante würde mir schon gefallen, wenn sie klappen würde, noch mal ein wenig probieren ...
mfg
HADI
---
ss:| zu:) ls:& fo:| de:] va:) ch:? sh:) n4:~ rl:° br:> js:| ie:{ fl:| mo:}
Hallo,
Dazu verwendet wird übrigens IE 6 + SVG Viewer 2.0.
Naja, ASV 3.01 oder 6.0 preview 1 sollten es schon sein (3.0 erschien im November 2001, 2.0 liegt also weit zurueck und ist noch nicht einmal auf das finale SVG 1.0 eingestellt).
Da aber embed und iframe nicht zum HTML Standard gehört, würde ich wenn möglich gerne drauf verzichten.
iframe kann durchaus in HTML 4.01 / XHTML 1.0 (jeweils Transitional) verwendet werden.
MfG, Thomas
Hallo !
Naja, ASV 3.01 oder 6.0 preview 1 sollten es schon sein (3.0 erschien im November 2001, 2.0 liegt also weit zurueck und ist noch nicht einmal auf das finale SVG 1.0 eingestellt).
Liegt leider es nicht an mir, sind unsere Standard Clients im Firmen Netzwerk. Soweit ich weiß wollen die aber den Viewer 3 in einem Update im April mit einbauen.
iframe kann durchaus in HTML 4.01 / XHTML 1.0 (jeweils Transitional) verwendet werden.
Ok, mal sehen wie dann der Rest der Seite sich im Quircks Mode verhält.
Danke, ich probiere mal weiter, ggf. gehe ich dann doch auf iframe.
mfg
HADI
---
ss:| zu:) ls:& fo:| de:] va:) ch:? sh:) n4:~ rl:° br:> js:| ie:{ fl:| mo:}
Hallo,
Liegt leider es nicht an mir, sind unsere Standard Clients im Firmen Netzwerk. Soweit ich weiß wollen die aber den Viewer 3 in einem Update im April mit einbauen.
Unbedingt auf 3.01 gehen: http://www.heise.de/newsticker/meldung/40909.
iframe kann durchaus in HTML 4.01 / XHTML 1.0 (jeweils Transitional) verwendet werden.
Ok, mal sehen wie dann der Rest der Seite sich im Quircks Mode verhält.
Transitional muss nicht zwangslaeufig zum Quirks Mode fuehren, siehe dazu den Artikel von Michael Jendryschik in der aktuellen iX: http://www.heise.de/ix/artikel/2004/03/136/ und dort speziell http://www.heise.de/ix/artikel/2004/03/136/03.shtml.
MfG, Thomas
Hallo Thomas !
Scheinst ja ein echter SVG Profi zu sein, finde ich klasse. Wenn ich meine Kollegen nach SVG frage, schauen die immer so unwissend.
Unbedingt auf 3.01 gehen: http://www.heise.de/newsticker/meldung/40909.
Ja, ich denke das machen die schon, liegt aber nicht an mir.
Also, bei einem iframe oder embed komme ich leider nicht sehr weit, entweder er findet das object nicht, es ist null oder er kennt die Eigenschaft oder Methode getSVGDocument() nicht.
Beim Object Tag bin ich nun so weit, daß ich mit getSVGDocument() auch das SVG Object bekomme, zuminderst gibt der alert das aus.
Leider wars das dann, bei getRootElement(), getFirstChild() oder rootElement.getAttribute() bekomme ich dann immer NULL zurück.
Gibt es noch andre Möglichkeiten auf die Eigenschaften des SVG zuzugreifen, ich kenne die Hierarchie eines SVG leider (noch!) nicht so gut, bin gerade am lernen.
Als Zusatzinfo ( Linksammlung :-) ):
Folgendes hat mir weiter geholfen und funktioniert soweit auch:
http://forum.de.selfhtml.org/archiv/2003/5/47950/
http://forum.de.selfhtml.org/archiv/2003/3/39506/
http://www.datenverdrahten.de/test/svg/frameset1.htm
http://www.datenverdrahten.de/test/svg/frameset3.htm
Folgendes bringt die schon erwähnten Fehler:
http://www.datenverdrahten.de/svglbc/embed_object_iframe.htm
http://www.datenverdrahten.de/test/svg/frameset2.htm
mfg
HADI
---
ss:| zu:) ls:& fo:| de:] va:) ch:? sh:) n4:~ rl:° br:> js:| ie:{ fl:| mo:}