google maps vectors and markers

by Lawrence Ross

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false&amp;extn=.js"></script>
<div id="map"></div>

CSS

html, body, #map {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

JavaScript

var locations = {}; //A repository for markers (and the data from which they were contructed).

	//initial dataset for markers
	var locs = {
	  1: {
	    info: '11111. Some random info here',
	    lat: -37.8139,
	    lng: 144.9634
	  },
	  2: {
	    info: '22222. Some random info here',
	    lat: 46.0553,
	    lng: 14.5144
	  },
	  3: {
	    info: '33333. Some random info here',
	    lat: -33.7333,
	    lng: 151.0833
	  },
	  4: {
	    info: '44444. Some random info here',
	    lat: 27.9798,
	    lng: -81.731
	  }
	};
	var map = new google.maps.Map(document.getElementById('map'), {
	  zoom: 1,
	  maxZoom: 8,
	  minZoom: 1,
	  streetViewControl: false,
	  center: new google.maps.LatLng(40, 0),
	  mapTypeId: google.maps.MapTypeId.ROADMAP
	});
	var infowindow = new google.maps.InfoWindow();

	var auto_remove = true; //When true, markers for all unreported locs will be removed.

	function setMarkers(locObj) {
	  if (auto_remove) {
	    //Remove markers for all unreported locs, and the corrsponding locations entry.
	    $.each(locations, function(key) {
	      if (!locObj[key]) {
	        if (locations[key].marker) {
	          locations[key].marker.setMap(null);
	        }
          if (locations[key].line) {
            locations[key].line.setMap(null);
          }
	        delete locations[key];
	      }
	    });
	  }

	  $.each(locObj, function(key, loc) {
	    if (!locations[key] && loc.lat !== undefined && loc.lng !== undefined) {
	      //Marker has not yet been made (and there's enough data to create one).
	      loc.line = new google.maps.Polyline({
	        path: [{
	          lat: loc.lat,
	          lng: loc.lng
	        }, {
	          lat: 41.0553,
	          lng: 24.17
	        }],
	        map: map,
	      });
	      // line.setMap(map);
	      //Create marker
	      loc.marker = new google.maps.Marker({
	        position: new google.maps.LatLng(loc.lat, loc.lng),
	        map: map,
          title: key
	      });

	      //Attach click listener to...