Export SVG with Style

Export SVG with Style插件简介

Export SVG with Style插件描述

Expts any SVG DOM elements (now including those within sameigin IFrames) on a web page to files f further use in drawing packages such as Inkscape.

Scans through CSS classes f styles the SVG  their child elements uses  adds them as stalone style elements to the SVG object, so the generated SVG file doesnt depend on external CSS classes. Good f passing out visualisations generated with D3.



Uses Eli Greys fileSaver routine: https://github.com/eligrey/FileSaver.js/

1.1: Now adds dummy svg node which holds computed style of svg elements parent node. Irons out a few discrepancies.

1.11: Dummy svg node now holds computed style of actual svg element, solves couple of further bugs.

1.12: Catches errs caused by invalid style rules rather than crashes

1.13: Couple me errs to do with parent style recognition ironed out.

1.14: Can now also pull out svg elements within IFrames.

1.15: Bugfix when css styles not present  xinczhang

1.16: Bugfix when IFrame is inaccessible (caused crash)

1.17: Bugfix where styles applied to svg element itself werent being picked up

1.18: Bugfix where class being an SVGAnimatedString caused a crash. Thanks to Robert Kerr f spotting this.

1.19: Thanks to Severin Neumann f adding the ability to include images embedded in SVG.

1.20: Catch stylesheet access exception err

1.22: Add alert popup to say what svgExpt has found. Save svgs with slightly useful filenames (svg elements id  class)
                                

Export SVG with Style插件离线安装方法

1.首先用户点击谷歌浏览器右上角的自定义及控制按钮，在下拉框中选择设置。

2.在打开的谷歌浏览器的扩展管理器最左侧选择扩展程序或直接输入：chrome://extensions/

3.找到自己已经下载好的Chrome离线安装文件xxx.crx，然后将其从资源管理器中拖动到Chrome的扩展管理界面中，这时候用户会发现在扩展管理器的中央部分中会多出一个”拖动以安装“的插件按钮。

4.下载 Export SVG with StyleChrome插件v1.23版本到本地。

5.勾选开发者模式，点击加载已解压的扩展程序，将文件夹选择即可安装插件。

注意：最新版本的chrome浏览器直接拖放安装时会出现“程序包无效CRX-HEADER-INVALID”的报错信息，参照这篇文章即可解决