How do I render my own maps for my website?

First of all, I would really consider using some pre-made map tiles as there are many offered for free and it saves you sigificant effort. There are for example the:

• main tile maps (tile usage policy here), the
• cloudmade tiles (Terms & Conditions), the
• cycle map tiles,

and probably many more (some of them commercial), offering you different styles that you can relatively easy integrate into your website.

You can do a lot of customization even with those pre-made maps (see below). Rendering your own maps is always quite some effort. You need to set up a renderer, retrieve the relevant data, render the tiles, put them on a webhost (the number of files quickly adds up to the thousands and millions) and repeat all that every few weeks to keep your maps updated.

Just, make sure you honor the respective terms of service for the tile service you use. Cloudmade offers a custom style editor which you might want to try out if you want to customize things.

The next level of customization is running your own openlayers (OL) slippymap installation which let's you offer cool things like POI overlays, colored paths and areas (OL example), added markers (OL example) and/or images on a map based on an input files or an RSS feed and many more things. Here is a real world example, showing all smoking and non-smoking restaurants in Germany, all without installing your own renderer and mucking with cartographic stylesheets... Have a look at the openlayers and slippymap pages in the osm wiki, and also make sure to explore the openlayers example page to get a glimpse of what is possible and snatch the code you want from there (you'll find the code for the above examples there too). Openlayers is the most common and in my view the most convenient solution, but the wiki page "Deploying your own Slippymap" lists a couple of alternative solutions.

That having said there are many renderers that you can use in order to create your own maps. Which one is the right one for you depends on many things. Do you need vector graphics (.svg) or .png files? Do you need one big map or 256x256 pixel tiles? Do you need to render them on-demand or do you want pre-made images? Do you need to render it once, or do you want to rerender with updated map-data frequently? Here are the commonly used ones:

• Osmarender: Converts an .osm file into an .svg file using a stylesheet in custom .xml format.
• Or/p: is an osmarender drop-in replacement that is faster (written in perl).
• Mapnik: Full blown mapnik install is probably NOT what you want to do when all you need is some nice maps as its set up involves pulling the .osm data in a postgis database and rendering from there. However, it is the fastest and most advanced solution out there in case you need frequent re-renderings or if you want to really do advanced things.

Less commonly used, but being designed for easy setup and usage are:

• Ceyx is an osm parser and MapCSS renderer. (UPDATE: it is unmaintained since 2010 and I don't think it can be used for much beyond small scale experimentation. Feel free to remove any mention of crux from this list.)(DISCLAIMER: I am the author of Ceyx, so forgive me this shameless advertisement :-)). MapCSS is the stylesheet language used by Potlatch2 to describe the look of a map and if you ever worked with HTML, you will quickly feel at home there. MapCSS is designed to be easy to customize. All it needs is python>=2.5, python-cairo and pygtk (for pango/pangocairo) installed. Please refer to its wiki page for more information (note that it works just fine but is currently in maintenance mode, looking for contributors.). Another python-based mapcss renderer that I can recommend is is Kothic.
• Something that I find personally very cool, is Kothic_JS which does client-side rendering of map tiles and which seems to work reasonably well, if you are not on a mobile device.
• Maperitive, an application written in mono to: render and print maps, as well as for setting up a local tile map server. It is the successor of Kosmos.

If that selection is not enough for you, you can see even more rendering software at the OSM 'Renderer' wiki page.

Of course you can. Actually there are many different option to do it. You can either render a static map image with one of the renderers listed below, your you can use a map where you can zoom and pan around. This option is called a slippy map. The most option to realize a slippy is map is openlayers. You can find documentation on the use of openlayers to display maps derived from OpenStreetMap data at wiki.openstreetmap.org/wiki/Openlayers.

However openlayers needs rendered map images (called tiles) so lets come back to the topic of renderers. There are many different renderers available for OSM data. A (probably incomplete) list can be found at wiki.openstreetmap.org/wiki/Rendering.

The most common renderer if you want to generate tiles is mapnik. Documentation can be found at wiki.openstreetmap.org/wiki/Mapnik. It is quite fast and produces a nice looking map. This renderer is used to feed the main slippy map at www.openstreetmap.org. Setting up a server running mapnik and feeding the tiles to openlayers can be quite a bit or work though.

Another popular renderer is osmarender. Unlike mapnik it does not directly generate PNG images but generates SVG images which need to be rasterized using inkscape or batik. This is the renderer used by the tiles@home project. It is not as fast as mapnik (and some say not as good looking) but it is somewhat easier to set up and run, especially if you want to implement a custom style or only need a single image.

There are many other different renderers and I would probably be good if you ask this question again with a bit more details on what you exactly want in you map.

Maperitive can render tiles. It works on OSM files though, so if you need a world-wide map, then you need a DB-based solution like Mapnik. On the other hand, setting up Maperitive is much easier. So it's more a question of what exactly your needs are.

I've made a sample hiking Web map made with Maperitive (warning: the server is slow).

Since this question was asked, this site has been created which is intended to summarise the "setting up a tile server" options, if that's the road that you want to go down. It doesn't (yet) describe style editing in detail, though.

The simplest way to do this would be to use Cloudmade's Style Editor. This provides a fair amount of flexability with the styling -- certainly enough to theme it to your website.

Check out some examples at the gallery.

Dependent on what you intend by "maps for my website" besides the already mentioned renderers like Mapnik and Maperitive you might also have a look at mapservers. There is the

• OSGeo http://mapserver.org/ licensed in an MIT-style license, which runs on all major platforms (Windows, Linux, Mac OS X).
• GeoServer also from OSGeo and Opensource: http://geoserver.org/display/GEOS/Welcome

Both are free and open and there are tools available to convert community stylesheets from OSM into the SLD-format to begin.

You can also use TileMill to create custom maps using OpenStreetMap data. TileMill uses the Mapnik renderer (the same one the OpenStreetMap website uses), and you can export the XML stylesheets it generates.

There's also a Quickstart Guide for creating an OSM based map available as well as an Intro course.

Disclosure: I work for MapBox

After selecting the right map tiles (Raster tiles are served as images for example, so they require less processing power and memory to render) , I'd start by making sure I'd have the following Maps SDK components - glyphs - fonts used for rendering vector maps - images - images used by widgets, POI icons, etc. - sprites - images used for rendering vector maps TomTom offers Maps SDK for Web,Android and iOS that should help you with this: https://developer.tomtom.com/products/maps-sdk

Use TopoMapCreator:

ExtendedMapCreator is a Desktop-Program, that creates "Topographic Maps" from OSM, NASA and ESA. You simply define a map extent by dragging over a browsable word map, click on start and wait till the GeoTIFF, ECW, GALILEO, ORUXMAPS or NAVIMAP files got created. ExtendedMapCreator is based on the Mapnik-Renderer, nevertheless all data downloading and processing is fully automatic. Click on ExtendedMapCreator to read more about the Program!