HTML5 GeoLocation

I know there's an app for this but I would like to learn how to do this.
When I upload my code onto the server it can find where I am in realtime with geolocatin.
But if I would like to monitor someone using the geolocation, how would I go about doing ths??
Do you need to download a Google API or something??

So if I am currently at location A and personXY is at location B. If I was to look at my monitor, how do I see personXY on google map in realtime.
Any tips or advice would be greatly appreciated.


Here's my code, that only monitors myself
Code:
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE></TITLE>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">
   var TIMEOUT = 300000;         
   var MAX_AGE = 1000;           
   var HIGH_ACC = true;          
   var ZOOM = 10;

   var watchID; 
   var map;                      
   var mapMarker;                

   
   window.onload = function (){
      if (navigator.geolocation) {
         watchID = navigator.geolocation.watchPosition(show_map, errorCheck, {
         maximumAge: MAX_AGE,
         timeout: TIMEOUT,
         enableHighAccuracy: HIGH_ACC 
      });
      }else {
         alert("Oops, Geolocation Not Supported.");
      }
   }
   
   
   function stopWatch(){
      if (watchID) {
         navigator.geolocation.clearWatch (watchID);
      }
         watchID = null;
   }   
    
    
   function errorCheck(error){      
      switch(error.code){
         case error.TIMEOUT:
            alert("Geolocation Timeout");
            break;
         case error.POSITION_UNAVAILABLE:
            alert("Geolocation Position Unavailable");
            break;
         case error.PERMISSION_DENIED:
            alert("Geolocation Permission Denied");
            break;
         default:
            alert("Geolocation Error Code: " + error.code);
      }
   }
   
   
   function show_map(position) {
      var lat = position.coords.latitude;
      var lon = position.coords.longitude;
      
      var latlng = new google.maps.LatLng(lat, lon);

      if(map) {                           
         map.panTo(latlng);
         mapMarker.setPosition(latlng);
      } else {                            
         var myOptions = {
            zoom: ZOOM,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
         };
         map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

         mapMarker = new google.maps.Marker({
            position: latlng,
            title:"You are here.",
            clickable: true
         });
         mapMarker.setMap(map);
      }

   }   
</script>
</HEAD>
<BODY>
 
<div id="map_canvas"></div>

</BODY>
</HTML>