Ist es möglich, ein Fangelement zu erstellen, ohne ein Svg-Objekt zu erstellen? [snap.svg]

Question

Ich möchte einige Snap-Elemente vorbereiten und später an einige Svg anhängen. Snap() Docs sagen, dass Snap() nur ein vorhandenes Svg-Objekt umbrechen oder ein neues erstellen kann. Ich kann keine Methode zum Erstellen einer Snap-Instanz finden, ohne ein Svg-Objekt zu erstellen.

Ich kann wie folgt tun:

var s = Snap(); 
s.remove(); 
var element = s.circle(1,2,3); 
new Snap("#desired").add(element); 

Es funktioniert, aber es ist hässlich. Gibt es einen besseren Weg, dies zu erreichen?

Genauer gesagt, würde ich in gewisser Weise wie abstrakte Schnappelemente zu erstellen, ohne die Abhängigkeit von DOM, etwa wie folgt:

var element = Snap.circle(1,2,3); // create some abstract independent element 
... 
var paper = new Snap("#some_svg"); 
paper.add(element); 

Answer 1

, wenn Sie ein Element in die Anfangs Snap-Funktion übergeben wird die neue anhängen Snap-Objekt zu diesem Element,

so konnte man ...

//create a specific element for the job 
var g = document.createElementNS('http://www.w3.org/2000/svg','g'); 
//create a snapsvg, attach it to g 
var s = Snap(g); 
// do your snappy stuff 
var bigCircle = s.circle(150, 150, 100); 
bigCircle.attr({ 
    fill: "#bada55", 
    stroke: "#000", 
    strokeWidth: 5 
}); 
var svg = document.querySelector('svg'); 
svg.style.background= 'red' 

//whenever you're ready attach it dom 
setTimeout(() => {svg.appendChild(g)}, 2500) 

pen