Schnapp SVG: String zu Element

In jQuery können Sie einfach ein Element erstellen, indem eine Zeichenfolge bereitstellt, etwa so:Schnapp SVG: String zu Element

var newElement = $('<div></div>');

Wie kann ich die gleiche Sache in Snap-SVG tun? Ich habe eine Zeichenfolge wie

<rect x="100" y="100" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 1825.4047 1024.3746)" fill="#7EC242" width="230.02" height="56.723" stroke="#64bc46"/>

Und ich brauche ein Element, das ich an ein bereits vorhandenes Snap-Dokument anhängen kann. Ich habe Fragmente probiert, aber sie haben nicht alle Funktionen, die ich brauche, um das Element danach zu manipulieren.

Quelle

2016-09-10 itd

Ich glaube, Sie es mit parse tun können (ich entfernte die Transformation so dass der Code in dem kleinen SO Snippet Fenster funktionieren kann):

var s = Snap("#svg"); 
 
var string = '<rect x="100" y="100" fill="#7EC242" width="230.02" height="56.723" stroke="#64bc46"/>' 
 
var rect = Snap.parse(string); 
 
s.append(rect);

<script src="http://cdn.jsdelivr.net/snap.svg/0.1.0/snap.svg-min.js"></script> 
 
<svg id="svg" width="400" height="200"> 
 
</svg>

Quelle

2016-09-10 15:35:52

Danke, aber das resultierende Objekt ein Fragment, das keine Operationen wie attr() oder appendTo() unterstützt. Die Funktion, die ich schreibe, ist Teil einer größeren App und muss denselben Objekttyp zurückgeben, den Sie erhalten, wenn Sie z. B. "paper.circle (10, 10, 10)" aufrufen. Ich nehme an, das Snap-Element ist nur ein Wrapper, also sollte es möglich sein, ein Fragment in ein Snap-Element zu verwandeln. Ich konnte einfach nirgends Informationen darüber finden – itd

Sie können das resultierende Objekt bearbeiten, Sie müssen es nur auswählen. Sie können die 'rect'-Variable nicht zum Ändern von Attributen verwenden, aber Sie können das Rechteckobjekt auswählen, nachdem Sie es dem Diagramm hinzugefügt und dann bearbeitet haben. Hier ist eine Möglichkeit: s.selectAll ("[fill = '# 7EC242']"). Attr ({fill: 'red'}) – AustinC

oder vielleicht besser für Ihren Anwendungsfall, einfach etwas zuweisen und dann was auch immer tun Sie mögen: var rect = s.selectAll ("[fill = '# 7EC242']") – AustinC

Schnapp SVG: String zu Element

Antwort

Verwandte Themen