Forums / Cotonti / Extensions / [UPDATE] User Map v2

	<div class="mboxBody">

	
		<div id="subtitle">A Map of Our Users</div>

		<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA3yEIYOYgH2dhSGxfk0rY-RThJwBHKWWgjnxCOmE66p23dSkf3hRBswvJ2rSfjA58My0_PfyTmgDhPw" type="text/javascript"></script>

<script type="text/javascript">
    function initialize() {
      if (GBrowserIsCompatible()) {
	var map = new GMap2(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.addControl(new GScaleControl());
	map.setCenter(new GLatLng(0.0, 0.0), 1, G_NORMAL_MAP);
	

	function createMarker(point, number, type)
	{
		var marker = new GMarker(point, customIcons[type]);
		// Show this markers index in the info window when it is clicked
		var html = number;
		GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(html);});
		return marker;
	};

    	var iconBlue = new GIcon(); 
    	iconBlue.image = 'plugins/usermap/markers/blue-dot.png';
    	iconBlue.shadow = 'plugins/usermap/markers/shadow.png';
    	iconBlue.iconSize = new GSize(32, 32);
    	iconBlue.shadowSize = new GSize(59,32);
    	iconBlue.iconAnchor = new GPoint(15, 32);
    	iconBlue.infoWindowAnchor = new GPoint(10, 40);

    	var iconGreen = new GIcon(); 
    	iconGreen.image = 'plugins/usermap/markers/green-dot.png';
    	iconGreen.shadow = 'plugins/usermap/markers/shadow.png';
    	iconGreen.iconSize = new GSize(32, 32);
    	iconGreen.shadowSize = new GSize(59,32);
    	iconGreen.iconAnchor = new GPoint(15, 32);
    	iconGreen.infoWindowAnchor = new GPoint(10, 40);

    	var iconRed = new GIcon(); 
    	iconRed.image = 'plugins/usermap/markers/red-dot.png';
    	iconRed.shadow = 'plugins/usermap/markers/shadow.png';
    	iconRed.iconSize = new GSize(32, 32);
    	iconRed.shadowSize = new GSize(59,32);
    	iconRed.iconAnchor = new GPoint(15, 32);
    	iconRed.infoWindowAnchor = new GPoint(10, 40);

    	var iconLtBlue = new GIcon(); 
    	iconLtBlue.image = 'plugins/usermap/markers/ltblue-dot.png';
    	iconLtBlue.shadow = 'plugins/usermap/markers/shadow.png';
    	iconLtBlue.iconSize = new GSize(32, 32);
    	iconLtBlue.shadowSize = new GSize(59,32);
    	iconLtBlue.iconAnchor = new GPoint(15, 32);
    	iconLtBlue.infoWindowAnchor = new GPoint(10, 40);

    	var iconPink = new GIcon(); 
    	iconPink.image = 'plugins/usermap/markers/pink-dot.png';
    	iconPink.shadow = 'plugins/usermap/markers/shadow.png';
    	iconPink.iconSize = new GSize(32, 32);
    	iconPink.shadowSize = new GSize(59,32);
    	iconPink.iconAnchor = new GPoint(15, 32);
    	iconPink.infoWindowAnchor = new GPoint(10, 40);

    	var iconPurple = new GIcon(); 
    	iconPurple.image = 'plugins/usermap/markers/purple-dot.png';
    	iconPurple.shadow = 'plugins/usermap/markers/shadow.png';
    	iconPurple.iconSize = new GSize(32, 32);
    	iconPurple.shadowSize = new GSize(59,32);
    	iconPurple.iconAnchor = new GPoint(15, 32);
    	iconPurple.infoWindowAnchor = new GPoint(10, 40);

    	var iconYellow = new GIcon(); 
    	iconYellow.image = 'plugins/usermap/markers/yellow-dot.png';
    	iconYellow.shadow = 'plugins/usermap/markers/shadow.png';
    	iconYellow.iconSize = new GSize(32, 32);
    	iconYellow.shadowSize = new GSize(59,32);
    	iconYellow.iconAnchor = new GPoint(15, 32);
    	iconYellow.infoWindowAnchor = new GPoint(10, 40);

    	var iconOrange = new GIcon(); 
    	iconOrange.image = 'plugins/usermap/markers/orange-dot.png';
    	iconOrange.shadow = 'plugins/usermap/markers/shadow.png';
    	iconOrange.iconSize = new GSize(32, 32);
    	iconOrange.shadowSize = new GSize(59,32);
    	iconOrange.iconAnchor = new GPoint(15, 32);
    	iconOrange.infoWindowAnchor = new GPoint(10, 40);

    	var customIcons = [];
    	customIcons["blue"] = iconBlue;
    	customIcons["red"] = iconRed;
      customIcons["green"] = iconGreen;
      customIcons["ltblue"] = iconLtBlue;
      customIcons["pink"] = iconPink;
      customIcons["purple"] = iconPurple;
      customIcons["yellow"] = iconYellow;
      customIcons["orange"] = iconOrange;

	
      var point = new GLatLng(52.13263300,5.29126600);
var marker = createMarker(point, '<div style=\"width:200px;\"><a href=\"users.php?m=details&amp;id=1\">Kingsley</a> - Netherlands<br><img src=\"./datas/avatars/1-avatar.gif\"></div>','yellow');
map.addOverlay(marker);


	
      }
    }
    </script>
  </head>
  
  <center>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map" style="width: 550px; height: 500px"></div> 
  </body>

  <center>




	</div>