How to make your own Fantasy Googlemap with MapLib without needing to be a code monkey

NB: I've since written an update to this article which details my thoughts about MapLib 6 Months into a mapping project of my own.

I've seen a couple of campaign world maps which use the googlemaps api and wondered how easy is it to make your own.  The answer very hard if you're not a bonafide javascript code monkey.  I then came across www.MapLib.net, a free service which allows you to build your own maps with custom overlays.  This is far too useful to keep to myself so here goes:

You'll Need:

• A JPG, PNG or GIF of your campaign world.
• A MapLib account (they're free)
• Plenty of patience

Add your map to MapLib.net

Once you're logged in, go to the "My Pictures" section and upload an image. If you want a 4:3 ratio map use the settings below.  Place a map pin to define a location and type in it's name in the pop-up box.  You can add descriptions (see the example below) to the pins and include hyperlinks.  If you have them upload your own custom icons (or use the ones that other users have uploaded) and attach them instead of the bog standard pin.  If you've got lots of pins to manage you can create categories for Capitals, Cities, Towns or what ever takes your fancy. If you need to mark out an area or a line use the polygon or line tool.

Embedding Tips

Make your iframe at least 500px wide so your users can close any map pin pop-ups you create.

After much trial and error I came up with these settings for my 4:3 ratio (2046 x 1536 pixels) map:

Zoom Level 7

IFRAME SETTINGS:

WIDTH: 512px, HEIGHT: 409px, LAT: -53.750, LNG: 36.558, Z: 7

Zoom Level 8

IFRAME SETTINGS:

WIDTH: 512px, HEIGHT: 409px, LAT: -53.750, LNG: 36.558, Z: 8

Zoom Level 8

IFRAME SETTINGS:

WIDTH: 512px, HEIGHT: 409px, LAT: -53.750, LNG: 36.558, Z: 9