2016-04-30 5 views
1

Я хочу подготовить некоторые элементы привязки и позже прикрепить их к некоторым svg. Snap() docs говорят, что Snap() может только обернуть существующий объект svg или создать новый. Я не могу найти метод создания экземпляра Snap без фактического создания объекта svg.Возможно ли создать элемент привязки без создания объекта svg? [snap.svg]

я могу сделать так:

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

Это работает, но это некрасиво. Есть ли лучший способ достичь этого?

Точнее, я хотел бы каким-то образом создать абстрактные элементы оснастки, без зависимости от DOM, что-то вроде следующего:

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

ответ

2

, если передать элемент в исходной функции защелкой он присоединит новый привязать объект к этому элементу,

так что вы могли бы ...

//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

+0

Это способ сделать это, но не практично. Точнее, я хотел бы каким-то образом создать абстрактные элементы привязки без зависимости от DOM. –

+1

Я не думаю, что это возможно, потому что snap wraps svg (document) методы – maioman