我可以将部分HTML页面导出为SVG图像吗?

时间:2022-04-01 07:50:22

I need a vector image of a Wikipedia navbox. Unfortunately, Inkscape can't open the HTML file, and neither Opera nor Chromium can save the page as SVG. Googling, googling, and yet more googling turned up nothing; in particular, 'HTML2svg' seems to mean functionality where the HTML 'talks to' an SVG image inside it. Does anybody how to turn HTML into SVG, either the entire page or a div on the page? I need the styled HTML, CSS and all.

我需要一个*导航框的矢量图像。不幸的是,Inkscape无法打开HTML文件,Opera和Chromium都无法将页面保存为SVG。谷歌搜索,谷歌搜索,然后更多的谷歌搜索没有任何结果;特别是,'HTML2svg'似乎意味着HTML'与'内部的SVG图像对话的功能。有人如何将HTML转换为SVG,无论是整个页面还是页面上的div?我需要样式化的HTML,CSS和所有。

5 个解决方案

#1


22  

I managed to find a website that will do the conversion for you. All you have to do is paste the HTML in between line breaks and it does the rest. The URL is: http://www.hiqpdf.com/demo/ConvertHtmlToSvg.aspx

我设法找到了一个可以为您进行转换的网站。您所要做的就是在换行符之间粘贴HTML,剩下的工作就完成了。该URL为:http://www.hiqpdf.com/demo/ConvertHtmlToSvg.aspx

#2


25  

I've come across the same need and found the following free utilities which hold promise that this is possible:

我遇到了同样的需求,并找到了以下免费实用程序,它们承诺这是可能的:

  1. WebVector is an HTML to SVG or PNG convertor. It converts a HTML document into a vector image in SVG format or a bitmap image in PNG format. The Standard Vector Graphics (SVG) files can be further edited by a variety of vector graphics editors such as Inkscape.
    http://cssbox.sourceforge.net/webvector/

    WebVector是一个HTML到SVG或PNG转换器。它将HTML文档转换为SVG格式的矢量图像或PNG格式的位图图像。标准矢量图形(SVG)文件可以由各种矢量图形编辑器(如Inkscape)进一步编辑。 http://cssbox.sourceforge.net/webvector/

  2. CutyCapt is a small cross-platform command-line utility to capture WebKit's rendering of a web page into a variety of vector and bitmap formats, including SVG, PDF, PS, PNG, JPEG, TIFF, GIF, and BMP. See IECapt for a similar tool based on Internet Explorer.
    http://cutycapt.sourceforge.net/

    CutyCapt是一个小型跨平台命令行实用程序,用于捕获WebKit将网页呈现为各种矢量和位图格式,包括SVG,PDF,PS,PNG,JPEG,TIFF,GIF和BMP。有关基于Internet Explorer的类似工具,请参阅IECapt。 http://cutycapt.sourceforge.net/

  3. wkhtmltopdf and wkhtmltoimage are open source (LGPL) command line tools to render HTML into PDF and various image formats using the QT Webkit rendering engine. These run entirely "headless" and do not require a display or display service. There is also a C library, if you're into that kind of thing.
    http://wkhtmltopdf.org/

    wkhtmltopdf和wkhtmltoimage是开源(LGPL)命令行工具,使用QT Webkit呈现引擎将HTML呈现为PDF和各种图像格式。这些完全“无头”,不需要显示或显示服务。如果你有这样的事情,还有一个C库。 http://wkhtmltopdf.org/

--

-

Unanswered Questions: I know that you can use something like rasterize.js to render DOM objects into <canvas>, but how are these libraries built such that they are able to export SVG? Specifically, can WebKit itself be used to output "pixel-perfect" editable SVG of web content and HTML snippets? Is this a relatively simple task for a library or is this something significantly more complex?

未解决的问题:我知道您可以使用类似rasterize.js的东西将DOM对象渲染到 中,但是如何构建这些库以便它们能够导出SVG?具体来说,WebKit本身可以用来输出“像素完美”可编辑的Web内容和HTML片段的SVG吗?对于库来说这是一个相对简单的任务还是这个更复杂的东西?

#3


5  

You can try wkhtmltoimage It can convert HTML to SVG and many different formats

你可以尝试wkhtmltoimage它可以将HTML转换为SVG和许多不同的格式

#4


0  

Tried xthexder's advice: printing to file. (And then converting PDF to SVG.) I tried Opera, Firefox, and Chromium under Linux; overview below. Real pity about Opera's bugs.

试过xthexder的建议:打印到文件。 (然后将PDF转换为SVG。)我在Linux下尝试了Opera,Firefox和Chromium;概述如下。对Opera的错误真的很遗憾。

I've made this answer community wiki; additions for other OSes welcome.

我做了这个答案社区维基;欢迎其他操作系统的补充。

Opera 11.61 (Linux)

  • supports printing to SVG(!), PDF, and PS
  • 支持打印到SVG(!),PDF和PS
  • uses author style sheet (unless you choose a different style sheet from the View menu, or disable CSS)
  • 使用作者样式表(除非您从“视图”菜单中选择不同的样式表,或禁用CSS)
  • With PDF and PS output, no text is put in the file! This is v. strange and must be a bug.
  • 使用PDF和PS输出,文件中没有文字!这是奇怪的,必须是一个bug。
  • If I choose SVG output, Opera produce a .svg file but writes PostScript code in it. :-(
  • 如果我选择SVG输出,Opera会生成一个.svg文件,但会在其中编写PostScript代码。 :-(

Firefox 11.0 (Linux)

  • supports printing to PDF and PS
  • 支持打印到PDF和PS
  • ignores author style sheet, prints in black and white
  • 忽略作者样式表,黑白打印
  • Uses DejaVu Serif font in a somewhat large size
  • 使用DejaVu Serif字体有点大

Chromium 17 (Linux)

  • supports printing to PDF only
  • 仅支持打印到PDF
  • ignores author style sheet, prints in black and white
  • 忽略作者样式表,黑白打印
  • Uses Times New Roman
  • 使用Times New Roman

#5


0  

You can try http://www.letime.net/alpha/glm.html

您可以尝试http://www.letime.net/alpha/glm.html

it do text to HTML5 draws in css3

它将文本转换为HTML5在css3中绘制

#1


22  

I managed to find a website that will do the conversion for you. All you have to do is paste the HTML in between line breaks and it does the rest. The URL is: http://www.hiqpdf.com/demo/ConvertHtmlToSvg.aspx

我设法找到了一个可以为您进行转换的网站。您所要做的就是在换行符之间粘贴HTML,剩下的工作就完成了。该URL为:http://www.hiqpdf.com/demo/ConvertHtmlToSvg.aspx

#2


25  

I've come across the same need and found the following free utilities which hold promise that this is possible:

我遇到了同样的需求,并找到了以下免费实用程序,它们承诺这是可能的:

  1. WebVector is an HTML to SVG or PNG convertor. It converts a HTML document into a vector image in SVG format or a bitmap image in PNG format. The Standard Vector Graphics (SVG) files can be further edited by a variety of vector graphics editors such as Inkscape.
    http://cssbox.sourceforge.net/webvector/

    WebVector是一个HTML到SVG或PNG转换器。它将HTML文档转换为SVG格式的矢量图像或PNG格式的位图图像。标准矢量图形(SVG)文件可以由各种矢量图形编辑器(如Inkscape)进一步编辑。 http://cssbox.sourceforge.net/webvector/

  2. CutyCapt is a small cross-platform command-line utility to capture WebKit's rendering of a web page into a variety of vector and bitmap formats, including SVG, PDF, PS, PNG, JPEG, TIFF, GIF, and BMP. See IECapt for a similar tool based on Internet Explorer.
    http://cutycapt.sourceforge.net/

    CutyCapt是一个小型跨平台命令行实用程序,用于捕获WebKit将网页呈现为各种矢量和位图格式,包括SVG,PDF,PS,PNG,JPEG,TIFF,GIF和BMP。有关基于Internet Explorer的类似工具,请参阅IECapt。 http://cutycapt.sourceforge.net/

  3. wkhtmltopdf and wkhtmltoimage are open source (LGPL) command line tools to render HTML into PDF and various image formats using the QT Webkit rendering engine. These run entirely "headless" and do not require a display or display service. There is also a C library, if you're into that kind of thing.
    http://wkhtmltopdf.org/

    wkhtmltopdf和wkhtmltoimage是开源(LGPL)命令行工具,使用QT Webkit呈现引擎将HTML呈现为PDF和各种图像格式。这些完全“无头”,不需要显示或显示服务。如果你有这样的事情,还有一个C库。 http://wkhtmltopdf.org/

--

-

Unanswered Questions: I know that you can use something like rasterize.js to render DOM objects into <canvas>, but how are these libraries built such that they are able to export SVG? Specifically, can WebKit itself be used to output "pixel-perfect" editable SVG of web content and HTML snippets? Is this a relatively simple task for a library or is this something significantly more complex?

未解决的问题:我知道您可以使用类似rasterize.js的东西将DOM对象渲染到 中,但是如何构建这些库以便它们能够导出SVG?具体来说,WebKit本身可以用来输出“像素完美”可编辑的Web内容和HTML片段的SVG吗?对于库来说这是一个相对简单的任务还是这个更复杂的东西?

#3


5  

You can try wkhtmltoimage It can convert HTML to SVG and many different formats

你可以尝试wkhtmltoimage它可以将HTML转换为SVG和许多不同的格式

#4


0  

Tried xthexder's advice: printing to file. (And then converting PDF to SVG.) I tried Opera, Firefox, and Chromium under Linux; overview below. Real pity about Opera's bugs.

试过xthexder的建议:打印到文件。 (然后将PDF转换为SVG。)我在Linux下尝试了Opera,Firefox和Chromium;概述如下。对Opera的错误真的很遗憾。

I've made this answer community wiki; additions for other OSes welcome.

我做了这个答案社区维基;欢迎其他操作系统的补充。

Opera 11.61 (Linux)

  • supports printing to SVG(!), PDF, and PS
  • 支持打印到SVG(!),PDF和PS
  • uses author style sheet (unless you choose a different style sheet from the View menu, or disable CSS)
  • 使用作者样式表(除非您从“视图”菜单中选择不同的样式表,或禁用CSS)
  • With PDF and PS output, no text is put in the file! This is v. strange and must be a bug.
  • 使用PDF和PS输出,文件中没有文字!这是奇怪的,必须是一个bug。
  • If I choose SVG output, Opera produce a .svg file but writes PostScript code in it. :-(
  • 如果我选择SVG输出,Opera会生成一个.svg文件,但会在其中编写PostScript代码。 :-(

Firefox 11.0 (Linux)

  • supports printing to PDF and PS
  • 支持打印到PDF和PS
  • ignores author style sheet, prints in black and white
  • 忽略作者样式表,黑白打印
  • Uses DejaVu Serif font in a somewhat large size
  • 使用DejaVu Serif字体有点大

Chromium 17 (Linux)

  • supports printing to PDF only
  • 仅支持打印到PDF
  • ignores author style sheet, prints in black and white
  • 忽略作者样式表,黑白打印
  • Uses Times New Roman
  • 使用Times New Roman

#5


0  

You can try http://www.letime.net/alpha/glm.html

您可以尝试http://www.letime.net/alpha/glm.html

it do text to HTML5 draws in css3

它将文本转换为HTML5在css3中绘制