Per JS hinzugefügter Node erscheint nicht

[Margin-Auto]

Hi,

und schon wieder ein Problem mit SVG und Scripting.....

In einem SVG-Dokument werden per Javascript neue Nodes hinzugefügt (kommen von einer Ajax-Abfrage). Wenn ich das per Skript überprüft, sind die neuen Nodes auch da mitsamt aller Attribute. Nur angezeigt werden sie nicht :-( Muss man da vielleicht ein Neuzeichnen veranlassen?
Getestet habe ich bislang nur im Gecko, an den IE bzw ASV habe ich mich noch nicht getraut.

  
klonen(ajax.responseXML, document.childNodes[1]);  
  
function klonen(quelle, ziel) {  
 // Die Funktion habe ich aus einem Beispiel in der c't geklaut  
 for(var i = 0; i < quelle.childNodes.length; i++) {  
  var knoten = quelle.childNodes.item(i);  
  
  switch (knoten.nodeType) {  
   case 1: // Elementknoten  
  
    var neu = ziel.appendChild(document.createElement(knoten.nodeName));  
  
    for (var j = 0; j < knoten.attributes.length; j++) {  
     neu.setAttribute(knoten.attributes[j].nodeName, knoten.attributes[j].nodeValue);  
    }  
    klonen(knoten, neu);  
    break;  
   case 3: // Textknoten  
    subknoten = document.createTextNode(knoten.nodeValue);  
    ziel.appendChild(subknoten);  
   // andere Knotentypen sind nicht relevant  
  }  
 }  
}  

TIA

Margin-Auto

[svg4you]

Tach Margin-Auto,

In einem SVG-Dokument werden per Javascript neue Nodes hinzugefügt (kommen von einer Ajax-Abfrage). Wenn ich das per Skript überprüft, sind die neuen Nodes auch da mitsamt aller Attribute. Nur angezeigt werden sie nicht :-( Muss man da vielleicht ein Neuzeichnen veranlassen?

Erzeuge die Elemente mit Bezug zum SVG-Namensraum, verwende also die Methoden mit "NS" im Namen, etwa:

  
var svgns="http://www.w3.org/2000/svg";  
var rechteck=document.createElementNS(svgns,"rect");

Man liest sich,
svg4you

[Margin-Auto]

Hi,

Erzeuge die Elemente mit Bezug zum SVG-Namensraum, verwende also die Methoden mit "NS" im Namen,

Vielen Dank, mit createElementNS läuft es jetzt (sogar im ASV). Sollte ich noch andere Funktionen durch die Namespace-Version ersetzen? get/setAttribute bspw.?
In http://forum.de.selfhtml.org/archiv/2005/10/t116579/#m746098 ist davon die Rede, dass das für xlink:href nötig ist. Muss in dem Fall dann für href-Attribute ein anderer Namensraum (http://www.w3.org/1999/xlink ?) angegeben werden, als für die anderen SVG-Attribute?

TIA

Margin-Auto

[svg4you]

Tach Margin-Auto,

Sollte ich noch andere Funktionen durch die Namespace-Version ersetzen? get/setAttribute bspw.?

Wenn die Attribute im Default-Namensraum des jeweiligen Elements angesiedelt sind, dann gibt es AFAIK mit getAttribute("attr_name") bzw. setAttribute("attr_name","attr_wert") keine Probleme. Ansonsten wäre in diesem Fall getAttribute(null,"attr_name") bzw. setAttribute(null,"attr_name","attr_wert") zu schreiben.

In http://forum.de.selfhtml.org/archiv/2005/10/t116579/#m746098 ist davon die Rede, dass das für xlink:href nötig ist. Muss in dem Fall dann für href-Attribute ein anderer Namensraum (http://www.w3.org/1999/xlink ?) angegeben werden, als für die anderen SVG-Attribute?

Ja.

Zur Orientierung sei auf die SVG Authoring Guidelines verwiesen.

Man liest sich,
svg4you

[Margin-Auto]

Hi,

vielen Dank, so funktioniert es jetzt.
Falls es jemanden interessiert, die Klon-Funktion sieht jetzt so aus:

  
function klonen(quelle, ziel) {  
 // Hilfsfunktion fuer Fussnoten-Darstellung im DOM  
 // Einfaches cloneNode() funktioniert nicht bei komplexen  
 // Gebilden; eine Schleife baut den Teilbaum nach.  
 // Quelle: c't 05/06  
 for(var i = 0; i < quelle.childNodes.length; i++) {  
  var knoten = quelle.childNodes.item(i);  
  
  switch (knoten.nodeType) {  
   case 1: // Elementknoten  
  
    var neu = ziel.appendChild(document.createElementNS(svgns, knoten.nodeName));  
    for (var j = 0; j < knoten.attributes.length; j++) {  
     if (knoten.attributes[j].nodeName.indexOf('xlink')==0){  
      neu.setAttributeNS('http://www.w3.org/1999/xlink', knoten.attributes[j].nodeName, knoten.attributes[j].nodeValue);  
     }else{  
      neu.setAttributeNS(null, knoten.attributes[j].nodeName, knoten.attributes[j].nodeValue);  
     }  
    }  
    klonen(knoten, neu);  
    break;  
   case 3: // Textknoten  
    subknoten = document.createTextNode(knoten.nodeValue, svgns);  
    ziel.appendChild(subknoten);  
   // andere Knotentypen sind nicht relevant  
  }  
 }  
}  

Margin-Auto