web-dev-qa-db-ja.com

HTMLページの一部をSVG画像にエクスポートできますか?

ウィキペディアnavboxのベクター画像が必要です。残念ながら、InkscapeはHTMLファイルを開くことができず、OperaもChromiumもページをSVGとして保存することはできません。 HTMLはその中のSVG画像と「対話」する機能を意味するようです。HTMLをSVGに変換する方法はありますか。ページ全体またはページ上のdivですか?.

45
Esteis

私は同じニーズに出くわし、これが可能であることを約束する以下の無料のユーティリティを見つけました。

  1. WebVectorはHTMLからSVGまたはPNGへのコンバーターです。 HTMLドキュメントをSVG形式のベクター画像またはPNG形式のビットマップ画像に変換します。標準ベクトルグラフィック(SVG)ファイルは、Inkscapeなどのさまざまなベクトルグラフィックエディターでさらに編集できます。
    http://cssbox.sourceforge.net/webvector/

  2. CutyCaptは、WebKitのWebページのレンダリングをSVG、PDFなどのさまざまなベクターおよびビットマップ形式にキャプチャするための小さなクロスプラットフォームコマンドラインユーティリティです。 、PS、PNG、JPEG、TIFF、GIF、およびBMP。 Internet Explorerに基づいた同様のツールについては、IECaptを参照してください。
    http://cutycapt.sourceforge.net/

  3. wkhtmltopdfおよびwkhtmltoimageは、レンダリングするオープンソース(LGPL)コマンドラインツールです。 HTMLをPDFおよびQT Webkitレンダリングエンジンを使用したさまざまな画像形式。これらは完全に「ヘッドレス」で実行され、ディスプレイまたはディスプレイサービスを必要としません。Cライブラリもあります。その種のものに。
    http://wkhtmltopdf.org/

-

未回答の質問: rasterize.js のようなものを使用してDOMオブジェクトを<canvas>、しかし、SVGをエクスポートできるようにこれらのライブラリはどのように構築されますか?具体的には、WebKit自体を使用して、WebコンテンツおよびHTMLスニペットの「ピクセル単位の」編集可能なSVGを出力できますか?これはライブラリの比較的単純なタスクですか、それともかなり複雑なものですか?

34
JeremyFelix

私はあなたのために変換を行うウェブサイトを見つけることができました。あなたがしなければならないのは、改行と改行の間にHTMLを貼り付けるだけです。 URLは次のとおりです。 http://www.hiqpdf.com/demo/ConvertHtmlToSvg.aspx

31
Bmize729

wkhtmltoimage を試すことができます。HTMLをSVGおよび多くの異なる形式に変換できます。

8
user1566713

Xthexderのアドバイスを試してみました:ファイルへの印刷。 (そしてPDFをSVGに変換します。)LinuxでOpera、Firefox、Chromiumを試してみました;概要。Operaのバグについては本当に残念です。

この回答コミュニティWikiを作成しました。他のOSの追加も歓迎します。

Opera 11.61(Linux)

  • sVG(!)、PDF、PSへの印刷をサポート
  • 作成者スタイルシートを使用します([表示]メニューから別のスタイルシートを選択するか、CSSを無効にしない限り)
  • PDFとPS出力では、テキストはファイルに置かれません!これはv。奇妙であり、バグでなければなりません。
  • SVG出力を選択した場合、Operaは.svgファイルを生成しますが、その中にPostScriptコードを書き込みます。:-(

Firefox 11.0(Linux)

  • PDF and PS
  • 著者スタイルシートを無視し、白黒で印刷します
  • やや大きいサイズのDejaVu Serifフォントを使用

Chromium 17(Linux)

  • PDFのみへの印刷をサポート
  • 著者スタイルシートを無視し、白黒で印刷します
  • Times New Romanを使用
3
Esteis