can I save the svg image in local system

[Nada]

Hello all,

I am drawing many svg images in html  page and I want to download all these images in the local system (my computer)

can I save the svg image in local system. it is not necessary to be created by snap.svg

[h.t.d...@gmail.com]

I do not completely understand your question, but if you're asking if you can save a (generated) SVG image in a HTML page, the answer is yes. In the end, the SVG is part of the DOM and using modern web development tools, you can inspect the DOM, select the nodes you're interested in (in this case the SVG element and all its children) and copy it. Just paste it in a text editor and you've downloaded the SVG image.

Now this is a bit cumbersome, but fairly easy to automate with a piece of javascript/browserplugin or even a scraper. I never used one, but it wouldn't surprise me if there already exists some of such tools.

[Nada]

hello h.t.d,

thanks for the replay..

yes I mean I generate an svg image then I want to save it on my local laptop so I can change the image later on.

I know there is a way .. I try some of them and none of them succeed ;(

[h.t.d...@gmail.com]

Okay. At https://gist.github.com/htdebeer/8bff0b1a0b2903d24c7e you'll find a generated SVG image. If you open that file in Firefox, you see something like in attached file "generated_SVG.png".

Now open the Web Developer Tools (CONTROL + SHIFT + i) by right clicking on the image and select the option 'Inspect Element' form the context menu. You see something like in "open_inspector.png"

Select the SVG Node, click right on it, and select the option 'Copy Outer HTML' (as in "copy_svg_element.png")

This copies the whole SVG element and all its children as text. Open a text editor. Paste the contents of clipboard and save the file like 'glass.svg'. You're done! You now have a SVG file on your computer.

[Nada]

thanks so much. I really appreciate you help and time so much.

it gives me an idea about how to save it .. 

My big problem is that I am generating hundred to thousent of images in may code. So I want the code to download the SVG images for me once it is created .. ( doing this is impossible by save as option)

so I will have at the end these hundred of SVG images on my laptop then I can use the next time on the browser without needing to spent time to redraw them again.

I tried this way: http://stackoverflow.com/questions/2483919/how-to-save-svg-canvas-to-local-filesystem

but it does not work and I do not way ;(

[h.t.d...@gmail.com]

Ah, I understand your problem. You might have more luck looking into headless browsers you can control through a program. I know there are a couple of them for node.js. These are popular for automatic testing of websites, but they can also be used for your purpose, I suppose.

[Carles Codony]

I'm not sure if this is what you are asking for, but you can download the data as a file with a 'Blob' URL. Not all browsers allow this, but it works in Chrome and Firefox.

Here's an example:

http://plnkr.co/edit/syNxhUQl4QkyAGVtmqHj?p=preview

There's no need to click a button, on chrome you could call the downloadSVG() function directly and it downloads the results without asking (or maybe it's just me having it disabled, i'm not sure)

[Andre Jacobs]

Hello,

I'm want to extend upon what Carles wrote as a solution.. How would I download embedded <image> with the svg? Hope someone sees this..

-Andre