Skip to main content
Homepage:

http://yostudios.github.com/Spritemapper/

Authors:

Yo Studios <opensource@yostudios.se>

Spritemapper is an application that merges multiple images into one and generates CSS positioning for the corresponding slices.

The package consists of a simple command-line tool that “does the job” and a Python library including its own PNG and CSS parser. The choice of writing/bundling this was to stay off 3rd-party requirements. Anybody who has ever had the pleasant job of installing PIL on various platforms should have a pretty good idea about what we’re trying to avoid.

There are multiple alternatives to Spritemapper, but they all require a bit too much manual labour, whereas Spritemapper reads your current CSS, replacing background images and position with the generated result.

This technique drastically improves your website’s loading speed, effectively reducing bandwidth by downloading fewer images.

Spritemapper in action

Here’s a simple example illustrating what Spritemapper will do with your CSS:

.emote.smile {
  background: red url(../img/emoticons/smile.png) no-repeat;
}
.emote.grin {
  background: white url(../img/emoticons/grin.png) no-repeat;
}

turns into:

.emote.smile {
  background: red url(../img/emoticons.png) no-repeat 0 0;
}
.emote.grin {
  background: white url(../img/emoticons.png) no-repeat 0 -16px;
}

Check our homepage for real life examples.

Usage

-h, --help

show a help message and exit

-c INI, --conf=INI

read base configuration from INI (see Configuration options)

--padding=N

keep N pixels of padding between sprites

Configuration options

Configuration options can be specified in one of two ways: inline in the CSS, or using passing an INI file with defaults. For CSS it looks something like:

/* spritemapper.output_css = foofile.css

You can do the exact equivalent using an INI file, like this:

[spritemapper]
output_css = foofile.css

It’s important to note that all paths are relative to the CSS file being processed.

base_url

a url at which the resulting css and image files can be reached. by default uses file-relative paths (recommended).

sprite_dirs

a list of directories within which to allow spritemaps to be generated. by default all directories are eligible.

recursive

set if sub-spritemaps should be generated when sub-directories are found. set by default.

output_image

the name of output spritemap image. sprite_dirs is incompatible with this because both tell the spritemapper how to sort sprites into spritemaps. by default <dir> + .png.

output_css

the name for the rewritten CSS file. by default sm_{basename}{extension}.

padding

amount of padding space between two images. this is mostly useful to counteract subpixel rendering artifacts on iOS devices. by default 1.

anneal_steps

a larger number here makes the box packer algorithm try more combinations. by default 9200.

Running tests

The test suite requires Nose. You can run them through setup.py, python setup.py test or plain nosetests.

Metadata

Release files for spritemapper 1.0.0

For a detailed explanation of source distributions (sdists) and built distributions (wheels), please see the package formats documentation.

Source distribution (sdist)

Source distribution for spritemapper 1.0.0
File Size Uploaded
spritemapper-1.0.0.tar.gz 394.4 kB Details

Release files / spritemapper-1.0.0.tar.gz

Download URL spritemapper-1.0.0.tar.gz
Size 394.4 kB
Tags Source
SHA-256 checksum
How to use checksums
a8abaf841de0c5b1647bfcd5c32b4accd2f4843b2a55e64f883dda973bd8c94d
BLAKE2b-256 checksum
How to use checksums
801cef073fd281e35c3c0d98ca461908ff196e87ca3453118a7ddbfb708966af
Upload date
Uploaded using Trusted Publishing?
What is trusted publishing?
No

Release history Release notifications | RSS feed

This release

1.0.0 This release

1 release file

0.6.0

1 release file

0.5

1 release file

Anthropic, PBC Visionary sponsor Bloomberg Visionary sponsor Hudson River Trading Visionary sponsor Meta Visionary sponsor NVIDIA Visionary sponsor Microsoft Sustainability sponsor Depot Continuous Integration AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Sentry Error logging StatusPage Status page