Skip to content

Instantly share code, notes, and snippets.

@unhammer
Last active December 21, 2015 22:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save unhammer/6376239 to your computer and use it in GitHub Desktop.
Save unhammer/6376239 to your computer and use it in GitHub Desktop.
Create animated SVG (using SMIL) from images
#!/bin/bash
duration=$1; shift
if [[ ! ( $duration =~ ^[0-9]+m?s$ ) ]]; then
echo "Usage: $0 duration img.jpg [img2.jpg …] > animation.svg"
echo "where duration is a time number like 2s or 400ms"
fi
cat <<EOF
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs>
EOF
i=0
declare -a ids_a
for f in "$@"; do
mime=$(mimetype -b "$f")
if [[ -z $mime || ! ( $mime =~ ^image/ ) ]]; then
echo "no image mimetype found for $f" >&2
continue
fi
(( i++ ))
ids_a+=( $i )
cat <<EOF
<image id="i${i}" x="0" y="0" width="100%" height="100%" preserveAspectRatio="true" xlink:href="data:${mime};base64,
EOF
base64 "$f" | tr -d '\n'
echo '"/>'
done
ids=$(printf "#i%s; " ${ids_a[@]})
cat <<EOF
</defs><use x="0" y="0" xlink:href="#i1"><animate attributeName="xlink:href" values="${ids}" dur="1s" repeatCount="indefinite"/></use></svg>
EOF
@unhammer
Copy link
Author

Leaves width/height at 100% since input images can have different w/h.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment