flash photoblog world map

you are here:  home > projects > flash photoblog world map
latest project news


2007-4-12
No more development is being done on the flash photoblog world map. It has been replaced by Trippermap which you can see above. You can still download the old version of the map including source code if you're wanting build a map for your own website. I'm currently working on a new version of Trippermap that will allow people to use photos from other photo sharing services besides Flickr or from photos on your own website.

2005-11-16
Trippermap.com beta testing has begun which allows a version of the flash photoblog world map to automatically find photos in a Flickr account and attach them to locations. Head over to the website and sign up for the beta testing to get your own Flickrmap.

2005-10-30
A new version of the map has been released and includes some very popular requested features.

  • Resize the map by simply changing the values in the html page.
  • Completely new map layers converted from the VMAP0 data set. This includes more detailed, up to date map layers like cities, lakes, rivers and roads. Each layer can be turned on/off and it's colour adjusted through the config.xml file. The new map data is now in much smaller tiles which load faster.
  • The photo thumbnail and text description size can be adjusted via the config.xml file.
  • View a large version of the photo and extended description within the flash map.
  • Hold down the space bar to drag the map around.
flickr world map firefox extension


Try out the experimental firefox extension based on the geourl extension. When you're on a web page which has been tagged with geourl metadata the globe will light up. Click on the globe to see a flash world map for that location with flickr photos and websites for the nearest city.

See an example page for Wellington, New Zealand

Install the flickr world map extension
Note: If you have the existing geourl extension installed, please uninstall it first before using the version above.

background


The flash photoblog world map is an application that plots images and locations onto a world map using latitude and longitude information.

Designed to be used with PHP or a scripting environment that can export a xml file from a database.


requirements


Flash player 7 or higher
Flash MX 2004 Pro (For editing the map only)
PHP & MYSQL


installation


Copy the "map" folder into a web accessible directory on your web server. All the map configuration options are found in the "config.xml" file. Detailed explanations for each option is available below. Two script examples are provided, one that can be edited by hand if you don't have a database and an example script for use with PHP and a MYSQL database.

With a PHP database
Edit the example "mapxml.php" page to match the information you have in your database or use the simple admin tool included.

There is a sample script "admin/read gps from exif/" included for reading GPS latitude and longitude data from the EXIF headers of a JPEG. If you work this into your admin tool you'll be able to tag photos using an application that links GPS data with photos and have the information automatically read by your script. Full admin tool coming soon!

If you're building your own admin tool and need a database of cities from around the world and their latitude and longitude locations GeoBytes has a free database you can download with 7000 international cities and 30,000 cities in the US. There's also a mysql sql script to import the txt data files.

Editing by hand, XML only
Open the "config.xml" file and change the "mapxmlurl" value to "mapxml.xml".

To place your locations on the map open the "mapxml.xml" file with a text editor and change each line to match your photos. You can duplicate the rows to add as many as you like. Just make sure each Id is unique.

Latitudes and longitudes need to be in decimal format. The easiest way to find a location is using the maporama.com website. See the GPS photography page.

Changing the size of the map
To change the size of the map simply edit the height and width parameters in the flash html code that loads the map swf file. See the "index.htm" in the "map" folder. You need to keep the rectangular proportion of the map and then add 20 pixels for the control strip at the bottom of the map. For example if you wanted the map to be 800 pixels wide then the height would be half the width plus 20 pixels or 420. Note that when editing the height and width parameters there are two sets of parameters that need to be updated, once in the object tag and the other in the embed tag.

Movable Type
Robby Edward's has written a great tutorial on integrating the flash photoblog world map with movable type.
Using an existing field in Movable Type (Simple)
Using a custom field in Movable Type (Complex)

Mambo
Integrate Flashmap with community builder

WordPress
Flash Photo map as a blog map

Map configuration
There are various options you can edit in the "config.xml" file to adjust the way your map is displayed when it loads.

mapxmlurl (default = "mapxml.php") - The url to an xml file containing the locations to plot on the map.

mapdatadir (default = "mapdata/") - Path to the directory where the map data is stored. This is useful if you have multiple versions of the map on your website, you can just point to the one folder rather than making duplicate copies of the mapdata. The path is relative to the map.swf file or you can specify a full url. The map data folder needs to be in the same domain as the "map.swf" file as per the flash player security settings unless you are using a cross-domain policy file.

mapstartlat & mapstartlong (default = "0") - If you want your map to load zoomed into a particular area these values set the center of the map to a specific latitude and longitude. Use in conjunction with mapstartzoom.

mapstartzoom (default = "1") - The zoom level at which the map should load. Anything over "6" will load the high resolution map tiles.

mapresettoworld (default = "1") - Sets the "Show World" reset button to either show the whole world "1" or "0" returns the map to the starting zoom level and position specified in mapstartlat, mapstartlong and mapstartzoom.

mapresettext to backtomaptext - Edit these entries to change any of the text used in the map.

show_upgrade_message (default = "1") - Shows an upgrade message if the person viewing the map is using an old version of flash player.

show_country to show_road - Allows you to turn on or off the map layers shown. If you turn on the lake and road layers you need to have downloaded the optional map layers and placed the folders within you "mapdata" folder.

show_largephoto (default = "1") - Loads a large version of the photo within flash rather than going to the specified url. If set to "0" when a user clicks on a location they will be sent to a url instead.

colour_sea to colour_road - Sets the colour used for each map layer. The colour value is in hexadecimal value. Most graphics applications have colour pickers that also display the colour as a hexadecimal number. Just take the last 6 digits of the colour and edit the value in the config file. Leave the "0x" at the start of the value as this tells flash it's a hexadecimal number. You could also use an online tool like colorblender or color scheme to generate a colour scheme for your map.

colour_country_alpha (default = "50") - Sets the transparency level of the country borders.

thumb_width & thumb_height - Sets the height and width of the photo thumbnail shown in the location popup. Flash will scale the thumbnail to this exact size.

popup_text_height & popup_text_width - Sets the height and width of the text area in the location popup panel. Use this to adjust how much text you can fit in the popup. If you want more content in the popup remember that what ever to put in the "loc" and "date" values of your xml file get displayed in the popup so you could put a whole paragraph of text in the "date" xml attribute if you wanted to.

high resolution flash world map data


The high resolution map data was converted from the freely available VMAP0 map data. The VMAP0 map was produced in the late nineties so there may be out of date political boundaries. Please let me know if you find errors and I'll update the data for future releases. Listed below are sources of VMAP0 data and the very useful Mapserver for windows that allowed me to generate the swf tiles from the VMAP0 map data.

VMAP0
MapServer for Windows - MS4W
CivicMaps Tile Engine


help


Help me make this app a great tool for the photoblog community. Please post any bugs you find, suggestions or feature requests in the map support forum. If you edit the PHP template to make it work with a bogging app like Movable Type, or Flickr please send me your edited script to include for other people.


to do...


» Multiple thumbnails for each location.
» Timeline showing spread of photos with sliders to adjust the locations shown on the map.
» Admin tool that uploads photos, generates and caches thumbnails, reads EXIF GPS data from JPG's and manages multiple locations. (as per allthegoodnes.com)
» Add place names, country names.


change log


1.4 (2005-10-30)
» On location click show large image within flash or go straight to url.
» Completely new map data based on VMAP0 which includes lakes, rivers, regions and roads.
» The new map data has improved the accuracy of the map when zoomed into to city level.
» New tile engine which speeds up the downloading of detailed map layers.
» The colour of each map layer can be changed through the config.xml file.
» Hold down the space bar to drag the map around.
» Resize the map by simply changing the values in the html page.
» The photo thumbnail and text description size can be adjusted via the config.xml file.

1.3 (2005-02-12)
» Added a configuration XML file to set map options and text.
» Added Atlantic and Pacific base maps.
» Added ability to set the map starting position and zoom level centered on a latitude/longitude.
» Cleaned up base map.
» Various bug fixes and improvements to the zoom code, thumbnail display and map edge detection.

1.2 (2005-01-19)
» Fixed major zoom bug that stopped map working under MacOSX.
» Added edge detection on map as it zooms out.
» Added simple admin tool by Augustas Kligys.
» Added example script for reading GPS data from the EXIF headers of a JPEG using Exifixer and then converting from degree to decimal format.
download latest version


Flash Photoblog World Map 1.4
Released 2005-10-30


flickr world map


Check out the flickr world map on which you can see photos from the photo sharing website flickr plotted on to the flash photoblog world map.

websites using the map


» Journeys of a crazed traveler
» Visit My Planet
» Somewhere in NZ
» Dennis & Fiona
» Idiosyncratic Verbosities
» Zoltan
» Dragon Company
» Abstract Musings
» Little Oslo's Postcards
» Stef around the world
» Rcardenas
» Burslem
» Luke Malcolm
» No longer afraid of the dark


GPS photo linking tools


» WMMX Location Stamper (Win)
» GPSPhoto (Linux)
» GPSPhotoLinker (MacOSX)
» iMagine Photo (MacOSX)
» EXIFutils (Command line)


how do you rate the map?


If you like the flash world map, please rate it or write a review at hotscripts.com