Load SVG into a specific div with Snap SVG

Question

What is the correct way to load an SVG file into a specific div using SnapSVG?

Following the documentation I have this JS:

var s = Snap();
Snap.load(         


        

Answer 1

This should work, its not far removed from your example, so its hard to tell whats wrong with yours without a live example and the svg to look at.

If you want to upload a fiddle or something, it may help.

var s = Snap("#svgdiv");
var l = Snap.load("path.svg", onSVGLoaded ) ;

function onSVGLoaded( data ){ 
    s.append( data );
}

Edit: Just to extend on Duopixels answer, the element you are trying to add, should be an svg element (ie

<svg id="mysvgtoload">...</svg> // you can add an svg to a div
<g id="mygrouptoload">...</g> // you can't add this to a div, but could to an svg element

in the file) or add the element (g or path or whatever) to an existing svg tag/element in your html. I suspect you may be trying to add a element direct to a div, which won't work, but its hard to tell without the file.

Also double check that Snap is loaded fine, and you can do a console.log( data ) in the function to check that it has loaded the markup correct.