Geolocation Google Maps 2

by sjmcpherson

HTML

<script src="//maps.googleapis.com/maps/api/js"></script>
<div id="demo"></div>
<div id="map"></div>

CSS

#map {
  width: 500px;
  height: 400px;
  display: block;
}

JavaScript

var x = document.getElementById("demo");

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}

function showPosition(position) {
  var latlon = position.coords.latitude + "," + position.coords.longitude;
  var d = new Date();
  var myLatlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
  console.log(d.toLocaleTimeString() + " " + latlon);
  setMapMarker(myLatlng, "current");
  //var img_url = "http://maps.googleapis.com/maps/api/staticmap?center="+latlon+"&zoom=14&size=400x300&sensor=false";

  //document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
}
var myVar = setInterval(myTimer, 5000);

function myTimer() {
  var d = new Date();
  //document.getElementById("demo").innerHTML += " " + d.toLocaleTimeString() + "<br/>";
  // getLocation();
}

function setMapMarker(location, name) {
  var marker = new google.maps.Marker({
    position: location,
    map: map,
    //icon: icon
  });
  markers.push(marker);
  setInfoWindow(marker, name);
}

function fitBounds() {
  if (!addressLoad) {
    var bounds = new google.maps.LatLngBounds();
    for (i = 0; i < markers.length; i++) {
      bounds.extend(markers[i].getPosition());
    }

    // Don't zoom in too far on only one marker
    if (bounds.getNorthEast().equals(bounds.getSouthWest())) {
      var extendPoint1 = new google.maps.LatLng(bounds.getNorthEast().lat() + 0.005, bounds.getNorthEast().lng() + 0.005);
      var extendPoint2 = new google.maps.LatLng(bounds.getNorthEast().lat() - 0.005, bounds.getNorthEast().lng() - 0.005);
      bounds.extend(extendPoint1);
      bounds.extend(extendPoint2);
    }

    map.fitBounds(bounds);
  }
}

function setInfoWindow(marker, name) {

  var infowindow = new google.maps.InfoWindow();
  if (infowindow) {
    infowindow.close();
  }

  var content = "<p>" + name + "</p>";
 ...