When I started the Wilder World Tour, I built a simple map so my Mom could know where I was during the trip. I thought others might be interested too.

I’d been meaning to find an extra day or two to wrap this all in a little wrapper and share it. I finally found time the last couple of days. The result is travelMap, a library that allows you to build your own travel maps including showing current location, lines between locations, and popup information about each stop.

Find the project on GitHub and use it, share it, fork it:

https://github.com/shawnwildermuth/travelMap

Installation

You can either download the travelmap.js (or min.js) or you can just use bower to install it:

> bower install travelmap

```csharp

### Dependencies

This project depends on [GMaps](https://github.com/hpneo/gmaps) and the Google Maps API. The bower package installs the GMaps project as a dependency already. It does not require any other libraries (e.g. no jQuery). It shouldn't have any problems working with any libraries as far as I know.

### Simple Usage

Before you can use the library, you need to include the Google API and GMaps libraries. Usually, you would include all three at once:


```xml
<script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript" ></script>
<script src="/bower_components/gmaps/gmaps.js" type="text/javascript" ></script>
<script src="/bower_components/travelmap/travelmap.js" type="text/javascript" ></script>
// Your Script Goes Here

Once you have the scripts, it’s usage is simply calling **createMap **and specifying the stops and selector:

// JavaScript
var map = travelMap.createMap({
  stops: [
    { 
      lat: 33.748995, 
      long: -84.387982, 
      info: "Atlanta, Georgia - Departed Jun 3, 2014" 
    },
    { 
      lat: 48.856614, 
      long: 2.352222, 
      info: "Paris, France - Jun 4-24, 2014" 
    },
    { 
      lat: 50.850000, 
      long: 4.350000, 
      info: "Brussels, Belgium - Jun 25-27, 2014" 
    }
  ],
  selector: "#map"
});

Let me know what you think!