Skip Talbot
EF5
Hey guys,
One of things I enjoy doing is writing up detailed chase logs. I always put a little map at the bottom of the log with a highlighted route. Over the years, I've been trying to come up with ways to make these maps better and easier to produce. Usually I take a screen shot of Street Atlas or Streets and Trips and either manaully highlight the roads in photoshop or use the route generators in the mapping software. The first method is tedious and the second leaves extra junk on the map, which is tedious to remove.
This year I'm using Google Maps. There are many advantages with this setup including a fully interactive map with panning, zooming, and custom annotations. There is free software that will convert your Street Atlas GPS logs into a Google Maps overlay, and Street Atlas waypoints into Google Maps markers. If you don't have a GPS log (or are missing data) you can also convert Street Atlas routes, and drawings and merge them into the same overlay. Here are some examples I've done on my site:
February 24, 2007 chase log
You can click on the white markers and it will pop up with a link to that part of my log and the associated photo.
I also have a national map with markers for all the chases I've gone on:
Main Chase Page
Clicking on the markers brings up a link to that particular log. You'll have to zoom in though to click the right one if they are clustered.
Here's a brief tutorial if you'd like to do something similar on your own site:
One of things I enjoy doing is writing up detailed chase logs. I always put a little map at the bottom of the log with a highlighted route. Over the years, I've been trying to come up with ways to make these maps better and easier to produce. Usually I take a screen shot of Street Atlas or Streets and Trips and either manaully highlight the roads in photoshop or use the route generators in the mapping software. The first method is tedious and the second leaves extra junk on the map, which is tedious to remove.
This year I'm using Google Maps. There are many advantages with this setup including a fully interactive map with panning, zooming, and custom annotations. There is free software that will convert your Street Atlas GPS logs into a Google Maps overlay, and Street Atlas waypoints into Google Maps markers. If you don't have a GPS log (or are missing data) you can also convert Street Atlas routes, and drawings and merge them into the same overlay. Here are some examples I've done on my site:
February 24, 2007 chase log
You can click on the white markers and it will pop up with a link to that part of my log and the associated photo.
I also have a national map with markers for all the chases I've gone on:
Main Chase Page
Clicking on the markers brings up a link to that particular log. You'll have to zoom in though to click the right one if they are clustered.
Here's a brief tutorial if you'd like to do something similar on your own site:
- Obtain a Google Maps API Key
- Convert your GPS logs into a Street Atlas drawing file. In Street Atlas, select the Drawing tab, click the File... button, and select Import. The file type is GPL. Once imported the track will appear in the Files list as an an1 file.
- Download GPSBabel and use the included GUI (or command line) to convert your Street Atlas an1 drawing files and anr route files to a GPX track, or GPX waypoints if you are converting Street Atlas waypoints. You'll want to restrict the number of points in your track by hitting the Filter button in the GUI and limiting it to a couple hundred points or so. Otherwise it can spit out thousands of points and bring your webpage to a grinding halt. Don't worry, this option takes every other point, and doesn't just lob off points at the end.
- Convert the GPX file into Google Maps usable Javascript/XML using the GPS Visualizer website. You'll want to use the Upload file section and select the GPX file on your hard drive. Make sure the point limiting option is greater than the number you used in GPSBabel or you'll be missing points.
- Steal the source generated by this website. You'll want to click the save map link after your map is generated. Copy out the list of track points (the first long list). GPS Visualizer also creates a marker for every point. This really clutters up the map and slows it down, so you'll probably not want to copy this section out of the source.
- Paste the results into a template website you have copied or created. You can use mine as an example:
http://www.drugrecognition.com/skip/chase/maps/070224.html
http://www.drugrecognition.com/skip/chase/maps/chases.html - Repeat the GPS Visualizer convert for your waypoint files and copy in the markers instead of the track.
- Modify the source to your liking, replacing the key in the example to the one you got from Google.
- Publish!
- If you have multiple gpx files, don't worry. When you paste the Javascript/XML points in your page, paste all the results from GPS Visualizer into the same array. Make sure you end each section with a comma. You'll wind up with one continuous track. If there is a jump between the two sections, a straight line will be drawn between them. Create a separate track array and and add it to your map as a separate overlay if this is undesirable.
- The Google Maps API is filled with neat features and functions you can add to your maps. I barely scratched the surface in my examples.
- Create a waypoint in street atlas that represents the senter of the map. Then you can copy the lat and long that GPS visualizer generates from the waypoint and replace the value in map.SetCenter()
- Don't forget all the CSS header tags or the map overlays won't work right. Copy the entire source from my examples to get started with.
- I use inline frames on my logs to display the maps because the Google Maps Key is only good for one directory on your server.
