«Bake» an SVG image into a PNG at a given resolution? [closed]
Questions seeking product, service, or learning material recommendations are off-topic because they become outdated quickly and attract opinion-based answers. Instead, describe your situation and the specific problem you’re trying to solve. Share your research. Here are a few suggestions on how to properly ask this type of question.
I’m on Linux and I’d like to take an SVG file and bake it into a PNG file at a given resolution (scaling). Is there a way to do this quickly and effectively from the command line? I’m looking for something like this:
svg2png --width 128 --height 128 input.svg output.png 2 Answers 2
convert -resize 128x128 input.svg output.png If the input canvas size is less than the given size, this will up-scale the output without re-sampling. To get a higher quality result, add -density parameter:
convert -density 500 -resize 128x128 input.svg output.png ImageMagick rasters vector images to their canvas resolution to a default density of 72 dpi.
To up-scale with proper sampling, you could specify an over high value, like 500 dpi in above sample.
Using a too high raster density can be a performance issue with large size canvas. The lowest and ideal raster density is: raster_density = raster_size / original_size * original_density
This ideal raster density will output image directly to the expected size (no -resize needed). But as float number approximations may occur, a slightly higher value and a resize are recommended for pixel-perfect result.
You can get original size and density using ImageMagick’s percent escapes:
convert input.svg -format "%w %h %[resolution.x] %[resolution.y]" info: Note that ImageMagick doesn’t handle the complete specifications of SVG. If having trouble with shapes rendered incorrectly, look at this thread about selecting ImageMagick SVG renderer.
Awesome, thanks. I found rsvg from the answer below on my own, but it’s really time I start using ImageMagick.
Didn’t work for my svg image. At first I received convert: unable to read font (null)’ @ error/annotate.c/RenderFreetype/1153.` errors which I resolved by brew install gs , but even when convert ran cleanly the resulting image is garbage.
(this applies to linux, may apply to windows) if you turn -verbose on IM then it would appear that IM itself uses inkscape to create an intermediate eps file. therefore i would suggest using inkscape directly with: inkscape in.svg —export-png=out.png (example from superuser.com/a/493028/316154)
Both rsvg and inkscape can:
$ rsvg Usage: rsvg [OPTIONS. ] file.svg file.png -d, --dpi-x= pixels per inch -p, --dpi-y= pixels per inch -x, --x-zoom= x zoom factor -y, --y-zoom= y zoom factor -w, --width= width -h, --height= height -q, --quality= JPEG quality -f, --format=[png, jpeg] save format -v, --version show version information Help options: -?, --help Show this help message --usage Display brief usage message $ inkscape --help Usage: inkscape [OPTIONS. ] [FILE. ] Available options: -V, --version Print the Inkscape version number -z, --without-gui Do not use X server (only process files from console) -g, --with-gui Try to use X server (even if $DISPLAY is not set) -f, --file=FILENAME Open specified document(s) (option string may be excluded) -p, --print=FILENAME Print document(s) to specified output file (use '| program' for pipe) -e, --export-png=FILENAME Export document to a PNG file -d, --export-dpi=DPI The resolution used for exporting SVG into bitmap (default 90) -a, --export-area=x0:y0:x1:y1 Exported area in SVG user units (default is the canvas; 0,0 is lower-left corner) -D, --export-area-drawing Exported area is the entire drawing (not canvas) -C, --export-area-canvas Exported area is the entire canvas --export-area-snap Snap the bitmap export area outwards to the nearest integer values (in SVG user units) -w, --export-width=WIDTH The width of exported bitmap in pixels (overrides export-dpi) -h, --export-height=HEIGHT The height of exported bitmap in pixels (overrides export-dpi) -i, --export-id=ID The ID of the object to export -j, --export-id-only Export just the object with export-id, hide all others (only with export-id) -t, --export-use-hints Use stored filename and DPI hints when exporting (only with export-id) -b, --export-background=COLOR Background color of exported bitmap (any SVG-supported color string) -y, --export-background-opacity=VALUE Background opacity of exported bitmap (either 0.0 to 1.0, or 1 to 255) -l, --export-plain-svg=FILENAME Export document to plain SVG file (no sodipodi or inkscape namespaces) -P, --export-ps=FILENAME Export document to a PS file -E, --export-eps=FILENAME Export document to an EPS file -A, --export-pdf=FILENAME Export document to a PDF file -T, --export-text-to-path Convert text object to paths on export (EPS) -F, --export-embed-fonts Embed fonts on export (Type 1 only) (EPS) -B, --export-bbox-page Export files with the bounding box set to the page size (EPS) -X, --query-x Query the X coordinate of the drawing or, if specified, of the object with --query-id -Y, --query-y Query the Y coordinate of the drawing or, if specified, of the object with --query-id -W, --query-width Query the width of the drawing or, if specified, of the object with --query-id -H, --query-height Query the height of the drawing or, if specified, of the object with --query-id -S, --query-all List id,x,y,w,h for all objects -I, --query-id=ID The ID of the object whose dimensions are queried -x, --extension-directory Print out the extension directory and exit --vacuum-defs Remove unused definitions from the defs section(s) of the document --verb-list List the IDs of all the verbs in Inkscape --verb=VERB-ID Verb to call when Inkscape opens. --select=OBJECT-ID Object ID to select when Inkscape opens. Help options: -?, --help Show this help message --usage Display brief usage message how to convert .svg image to .png? [duplicate]
I would like to change the color of some SVG pictures and then save them as PNG images. I have installed GIMP. I am running Ubuntu 14.04. How can I do that?
2 Answers 2
- With GIMP, open the SVG, then use the Export action from the File menu (or press Ctrl E ):
- Select PNG from the drop down menu or the Select File Type list:
- Select appropriate settings and export:
I wouldn’t use it to edit SVGs either, but it can convert well enough. And then edit the converted images.
You could install Inkscape, open your SVG file in it, do your edits, and use the File > Export PNG image. option ( Shift + Control + e ) to do the conversion.
This is my standard procedure, and it works flawlessly. How well it works for you might depend in the source for your SVG, but certainly worth trying.
It should be possible to do this with Image Magick, as noted in another Q&A, but I always find that a bit trickier to control, and there’s a bit of a learning curve there. It also appears that the «Converseen» front-end hasn’t been updated for Ubuntu 14+, and its website has issues (so far as I can see).
Is there a way to batch export SVGs to PNGs?
I have these SVGS and I’d like to export them to PNG images, I could export them with Inkscape but that would mean open each file and export that file to PNG which is not efficient (I have hundreds of them). How can I do this?
5 Answers 5
It appears you can use Inkscape from command line:
I imagine you can write a simple bash script to process all SVG files:
#!/bin/sh for file in *.svg do /usr/bin/inkscape -z -f "$" -w 640 -e "$.png" done the example above converts all .svg files in the current directory, adding .png extension to the output files.
I’m trying to export several hundreds of svgs, how can I set the export value (dest) so they keep their name? because this seems to work fine for a small quantity.
all the files are saved
Inspired by the previously accepted answer I came up with this one-liner:
For Inkscape version 0.92.4 and earlier:
for file in *.svg; do inkscape "$file" -e "$png"; done This way you don’t need to call a script. If you wanted to, you could create an alias for converting all svgs in the current directory to pngs:
alias svgtopng='for file in *.svg; do inkscape "$file" -e "$png"; done' For Inkscape version 1.0 Beta and later:
for file in *.svg; do inkscape "$file" -o "$png"; done This way you don’t need to call a script. If you wanted to, you could create an alias for converting all svgs in the current directory to pngs:
alias svgtopng='for file in *.svg; do inkscape "$file" -o "$png"; done' You can wrap $file and $
Graphical Nautilus Script
The command line is great for batch conversions but sometimes you just don’t want to leave the comfort of your GUI. That’s why I coded a GUI-based Nautilus script to batch convert SVG files to PNG images. Other file managers with custom actions (e.g. Thunar) should be supported, too.
#!/bin/bash # NAME: SVG2PNG # VERSION: 0.1 # AUTHOR: (c) 2014 Glutanimate (https://github.com/Glutanimate) # # DESCRIPTION: Simple application to convert SVG files to PNG files based on DPI or resolution. # Designed to work as a context menu script in file managers like Nautilus and Thunar. # # FEATURES: - Converts SVG image file to PNG raster of a specific DPI or width # - SVG preview # - choose between converting the full SVG page or only the cropped image # # DEPENDENCIES: inkscape imagemagick yad # YAD (1) is an advanced for of Zenity with many improvements. It's not included in the # official Ubuntu repos yet (2) but can be installed from a webupd8 PPA (3) # # LICENSE: MIT license (http://opensource.org/licenses/MIT) # # NOTICE: THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, # INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR # PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE # LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, # TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE # OR OTHER DEALINGS IN THE SOFTWARE. # # # USAGE: SVG2PNG image1.svg image2.svg [..] # I recommend installing this script as a context menu action for your file manager. # Instructions for Nautilus may be found on AskUbuntu (4). # # NOTES: The script uses convert for previews because it's faster. For optimal results # the actual conversion is done with inkscape's command line interface. # # LINKS: (1) https://code.google.com/p/yad/ # (2) https://bugs.launchpad.net/ubuntu/+bug/796633 # (3) https://launchpad.net/~webupd8team/+archive/y-ppa-manager # (4) https://askubuntu.com/questions/236414/how-can-i-install-a-nautilus-script ############## DIALOGS ################### TITLE="SVG to PNG" ICON="svg" ############## USGCHECKS ################# # checks if user selected an item if [ $# -eq 0 ] then yad --title="$TITLE" \ --image=dialog-error \ --window-icon=dialog-error \ --class="$WMCLASS" \ --text="Error: no file selected" \ --button="Ok":0 echo "Error: no file selected" exit fi ############### GLOBVAR ################## SVGFILES="$@" TEMPDIR=$(mktemp -d) PREVIEWIMG="$TEMPDIR/svgpreview.png" ############### CLEANUP ################## trap "rm -r $TEMPDIR" EXIT ############## FUNCTIONS ################# converttosvg_dpi()< echo "Converting based on DPI." while [ $# -gt 0 ]; do echo "$# file(s) left to convert." SVGFILE="$1" FILESTEM="$" PNGFILE="$FILESTEM".png inkscape "$SVGFILE" -z --export-dpi="$DPI" \ --"$AREASETTING" --export-png="$PNGFILE" shift done echo "Done." > converttosvg_res()< echo "Converting based on Width." while [ $# -gt 0 ]; do echo "$# file(s) left to convert." SVGFILE="$1" FILESTEM="$" PNGFILE="$FILESTEM".png inkscape "$SVGFILE" -z --export-width="$WIDTH" \ --"$AREASETTING" --export-png="$PNGFILE" shift done echo "Done." > createpreview() < convert -resize 128x "$1" "$PREVIEWIMG" >getsettings() < SETTINGS=$(yad --window-icon "$ICON" --image "$PREVIEWIMG" --width 300 --height 200 --always-print-result \ --form --separator="|" --title="$TITLE" --text "Please choose the DPI or resolution to convert to." \ --field="DPI:NUM" 10[!80..600[!10]] --field="Width in px:NUM" 16[!16..4096[!16]] \ --field="Area:":CB "Drawing"\!"Page" \ --button="Convert based on DPI:2" --button="Convert based on Resolution:3" --button="gtk-cancel:1") RET=$? # Exit code? if [ "$RET" = 252 ] || [ "$RET" = 1 ] # WM-Close or "Abort" then echo "Exiting. " exit fi DPI=$(printf %.0f $(cut -d "|" -f 1 <<<"$SETTINGS")) #round values WIDTH=$(printf %.0f $(cut -d "|" -f 2 <<<"$SETTINGS")) AREA=$(cut -d "|" -f 3 <<<"$SETTINGS") case "$AREA" in Drawing) AREASETTING="export-area-drawing" ;; Page) AREASETTING="export-area-page" ;; esac echo "DPI set to $DPI" echo "Width set to $WIDTH" echo "Area set to $AREA" >################ MAIN #################### createpreview "$1" getsettings case "$RET" in 2) echo 2 converttosvg_dpi "$@" ;; 3) echo 3 converttosvg_res "$@" ;; esac exit 0 I will try to keep this answer updated but please check out my Github repository for the latest version of the script.
Installation
Generic installation instructions for all Nautilus scripts may be found here. The following commands should cover all the necessary dependencies:
sudo add-apt-repository ppa:webupd8team/y-ppa-manager sudo apt-get update sudo apt-get install yad inkscape imagemagick For further information please consult the script header above.
After installing the script you should be able to invoke it from your file manager’s context menu. Simply select one or more SVG files and click on the appropriate entry in your context menu. A GUI dialog should come up with several options concering the conversion.
You can either convert the SVG based on DPI or width. The aspect ratio will be conserved in both cases. Make sure to supply your DPI or width of choice before clicking on the conversion buttons.
You can also choose between exporting the full SVG file or only the cropped drawing. If your SVG canvas has a lot of empty space it’s advisable to choose «Drawing» as the export option.