Export SVG with Style

Featured

3.2(

42 ratings

)

Extension Workflow & Planning5,000 users

19 support issues

For additional help, check out the developer's support site.

Cidney Uwabo-Dodson

Aug 3, 2018

Cannot click on extension after accidentally clicking "do not download multiple" on chrome

How do you undo this setting on chrome? All I want to do is use your extension...

A Chrome Web Store user

Jul 27, 2018

initial attempts with no result on URL as mentioned below

I tried to use the "Export SVG with Style"-Extension for the first time today. My aim was to grab the LOGO from this URL https://www.wienfluss.net/ . I was unaware whether it was sufficient to just have the URL loaded in chrome (and of cause the respective tab in chrome opened) To start the process, OR if I would need to somewhat "mark" the respective svg beforehand (or after I clicked the extension-button)? So I started to try to use the extension, simply by clicking the Icon in the system - tray. I tried around for a little bit, but the extension-Button did not provide me with any helpful feedback whatsoever. Therefore, I felt I was left in the blind. The Idea of this extension is brilliant though: I would still love to be able to use this extension effectively. Currently hitting the little button the Extension offers no feedback whatsoever. The extension-button is located next to the chrome Adress-Bar and does not yield any feedback at all, the process therefore feels pretty "dead". Could the extension bring up a layer to let the user know what happend ? Let the user know Where , or why, the extension fails? Some Feedback might provide information that: "Unluckily it did not succeed this time, but it might work out next time on a different page, this is why:... ".

Kilian Evang

Feb 24, 2018

How to use it?

I couldn't find any information on how this is supposed to be used. When I click the SVG button, nothing happens.

Richard King

Nov 3, 2017

Maintaining relative layout of multiple svgs

If there are multiple svgs on a page is there a way to export them all together or otherwise maintain their relative positions to one another when opened in a graphics package?

Zhi Kai Li (Muggy)

Jul 31, 2017

Does not work for my page

So i created a resume page for myself and it seems that the plugin works nicely the last time i had to update my resume but this time oddly enough, it seems to fail. I tried it on a few other web sites and it seems to be working just fine. the URL to my resume is https://resume.mugdev.com/ and when I click the button it doesn't do anything. I tried to look in the console for any potential errors but there doesn't seem to be any. It would be nice if I can get this working again as it seems to be the only thing that I can do to get my page printed in a reasonable way. Thanks!

Robert Kerr

Jul 18, 2017

Export fails in SVG w/ Animation

In svgexp.js, in parentChain around line 121.

elemData.class.split fails in some cases.

In my case, it was because elemData.class is of type SVGAnimatedString instead of type object.

I was able to fix locally by wrapping lines 121 - 132 with an if clause that checks the type of elemData.class like so:

function parentChain (elem, styles) {
// Capture id / classes of svg's parent chain.
var ownerDoc = elem.ownerDocument || document;
var elemArr = [];
while (elem.parentNode !== ownerDoc && elem.parentNode !== null) {
elem = elem.parentNode;
elemArr.push ({id: elem.id, class: elem.className});
}

// see if id or element class are referenced in any styles collected below the svg node
// if not, null the id / class as they're not going to be relevant
elemArr.forEach (function (elemData) {
var presences = {id: false, class: false};
if(typeof(elemData.class) == "string") {
var classes = elemData.class.split(" ").filter(function(a) { return a.length > 0; }); // v1.13: may be multiple classes in a containing class attribute
styles.forEach (function (style) {
for (var c = 0; c < classes.length; c++) {
if (style.indexOf ("."+classes[c]) >= 0) {
presences.class = true;
break; // no need to keep looking through rest of classtypes if one is needed
}
}
if (elemData.id && style.indexOf ("#"+elemData.id) >= 0) {
presences.id = true;
}
});
};
Object.keys(presences).forEach (function (presence) {
if (!presences[presence]) { elemData[presence] = undefined; }
});
});

return elemArr;
}

This fix is probably sub optimal because it would miss styles on the elements causing the error. I figure you will know a better way.

Hal Armstrong

Jun 21, 2017

Trying to use local CSS and save SVG to local disk. Does nothing

If I press the SVG button nothing happens.

No error message. No log file.

How to debug this issue. Is all processing done in the SVG Chrome extension or is it trying to contact a remote server somewhere.

Great idea.

I wish it did something.

If I can help, let me know.

M Graham

Feb 21, 2017

Possible 'Doesn't Work' Fix

IMPORTANT NOTE: If nothing happens, there's a high chance the extension has been denied cross-origin access to an IFrame the svg is in. This is a security restriction put in place by Chrome.

Search for and install zboogs Open Frame extension - https://chrome.google.com/webstore/detail/open-frame/kdhjgkkaacdhdioocfbpmhjidbinfajj?hl=en

Then you can right-click on the graphic and open it in a new browser tab and try the SVG export from there. It works in JSFiddle for one.

Bernard de Jong

Feb 15, 2017

Doesn't work

Nothing happens when clicking the button.. No settings available either, so it's useless..

shikha aggarwal

Jan 13, 2017

Doesn't do anything

It is not working.I am unable to download svg file