I know I can use an inline <svg>
element to load snap svg. However I would like to use an non-inlined file via an <img>
element:
JavaScript
x
2
1
<img alt="comparison" src={arcStatic('/images/comparison.svg')} />
2
JavaScript
1
3
1
var diagram = Snap('img'),
2
group = diagram.select('#someGroup')
3
Where someGroup
is an svg
g
element, fails. group
is null.
Additionally:
JavaScript
1
2
1
console.log('diagram.constructor.name);
2
Shows this is an Element
rather than a Snap instance.
How can I use snap.svg with external files?
Advertisement
Answer
Use the Paper.image
function: http://snapsvg.io/docs/#Paper.image and put the images into the page with snap, so that you can access them.