Inkscapeで作成したSVGファイル内のベクター系の画像をエクスポート(書き出し)して、JPEG、PNG、WebPなどのラスター系(ビットマップ系)の画像形式で保存する方法です。
Inkscapeで互換性の高いJPEG、劣化がなく透過情報を含むPNG、容量を小さく抑えられるWebPのようなラスター系の画像形式での保存には範囲の指定と対象とするオブジェクトの限定ができる「エクスポート機能」を利用します。
ファイルメニューにある「保存」はファイル単位でInkscape SVG形式での保存、「別名で保存」は別の形式に変換して保存で、ラスター系での保存はできません。
Inkscape 1.3のエクスポートダイアログはデフォルトでJPEG・PNG・WebP・TIFF・PDF・SVGのエクスポートができ、メニュー > 編集 > 環境設定 > 入出力 > エクスポートダイアログにすべての出力を表示 を 「有効」にすると対応できる形式の追加もできます。
形式の特性や用途に応じた詳細な最適化をしたい場合やGIF・BMPなど他の形式が必要な場合は無劣化のPNGでエクスポートしたファイルをGIMPで変換などします。
Inkscape 1.0まではエクスポートできる形式がPNGのみだったため、GIF・JPEGなどの他の形式が必要な場合は書き出し、保存したPNGをGIMPで変換などが必要でした。
画像の形式ごとの特徴と形式の選び方はGIF・JPEG・PNGの詳細をご覧ください。
InkscapeでSVGファイル内からPNGなどの別の形式で書き出す領域を設定します。
Inkscapeの「エクスポートダイアログ」で「ドキュメント」、「ページ」、「選択範囲」、「カスタム」から範囲を選択します。
「カスタム」を選択すると自動的に直前に選択していた範囲に合わせた数値が「左」、「上」、「右」、「下」、「幅」、「高さ」に設定され、必要に応じてそれらを元に連動する数値入力で変更できます。
Inkscapeの「PNG 画像にエクスポートダイアログ」で「ページ」、「描画全体」、「選択範囲」、「カスタム」から範囲を選択します。
書き出し範囲は座標で(x0, y0)と(x1, y1)が対角となる四角形で、「ページ」、「描画全体」、「選択範囲」は選択すると自動的に領域が設定されます。
「カスタム」を選択すると自動的に直前に選択していた範囲に合わせた数値が設定され、必要に応じてそれらを元に連動する数値入力で変更できます。
InkscapeでSVGファイル内の指定した領域をどれだけの大きさで書き出すかを設定します。
エクスポートダイアログの 画像サイズ > DPI(0.91は解像度)を下記に合わせると、幅と高さが得られます。
ウェブサイトなどのスクリーン表示で使用する場合の解像度です。
拡大・縮小してサイズを合わせてから上記の解像度でエクスポートするか、拡大・縮小せずエクスポートダイアログの 画像サイズ > 幅 と 高さ に必要なサイズを入力します。(解像度は自動)
エクスポートダイアログの 画像サイズ > DPI(0.91は解像度)に必要な解像度を入力します。(幅と高さは自動)
拡大・縮小してサイズを合わせてから必要な解像度でエクスポートするか、拡大・縮小せずGIMPの「画像の拡大・縮小」などを使って必要な物理サイズと解像度でのピクセル数を計算してその数値をエクスポートダイアログの 画像サイズ > 幅 と 高さ に入力します。(解像度は自動)
Inkscapeで作成したSVGファイル内に設定されたページの領域をPNGなどの別の形式で書き出す方法です。
ページ内に見えているものがエクスポートされました。
Inkscapeで作成したSVGファイル内で選択したオブジェクトが占める領域にあるものをPNGなどの別の形式で書き出す方法です。
選択範囲内に見えているものがエクスポートされました。
Inkscapeで作成したSVGファイル内で選択したオブジェクトが占める領域で選択したもののみをPNGなどの別の形式で書き出す方法です。
選択したオブジェクトがエクスポートされました。
範囲内でオブジェクトがない部分は透明となり、合成で背景が透過できます。
マスクや透明設定のある塗り・線は、不透明〜半透明〜透明になります。
Inkscapeでレイヤーごと、グループごと、オブジェクトごとに分けて書き出す方法です。
書き出した画像はGIMPなどでレイヤーとして重ねて使用できます。