Return to Snippet

Revision: 46883
at June 6, 2011 19:37 by marzsman


Updated Code
<script type="text/javascript">
var network = [];
network.push({title:"{title}",address:"<div class='infowindow'><h3>{title}</h3>{network_street}<br/> - {network_zip} {network_city}<br/>{network_country}<a href='{network_url}'>{network_url}</a></div>",lat:{network_lat},lng:{network_lng}});
</script>
//////////////////////////////
var map,markers=[],bounds,infowindow;
function initialize() {
	var myLatlng = new google.maps.LatLng(51.05866,3.713379);
	var myOptions = {
		zoom: 8,
		center: myLatlng,
		streetViewControl: false,
		scrollwheel:false,
        mapTypeId: google.maps.MapTypeId.ROADMAP  
	}
	map = new google.maps.Map(document.getElementById("gmap"), myOptions);
        infowindow = new google.maps.InfoWindow();
    bounds = new google.maps.LatLngBounds();
    mapReady();
}
function mapReady() {
    for(var i=0;i<network.length;i++){
        addPoint(network[i]);
    }
    map.setCenter( bounds.getCenter(), map.fitBounds(bounds));
}
function addPoint(data) { 
    var point = new google.maps.LatLng(data.lat,data.lng);
    var marker = new google.maps.Marker({
        position: point,
        map: map,
        title: data.title
    });
    markers.push(marker);
    bounds.extend(point);
    
    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(map,marker);
      infowindow.setContent(data.address);
    });
}
function loadScript() {
	var script = document.createElement("script");
	script.type = "text/javascript";
	script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
	document.body.appendChild(script);
}
window.onload = loadScript;

Revision: 46882
at May 27, 2011 03:53 by marzsman


Initial Code
<script type="text/javascript">
var network = [];
network.push({title:"{title}",address:"<div class='infowindow'><h3>{title}</h3>{network_street}<br/> - {network_zip} {network_city}<br/>{network_country}<a href='{network_url}'>{network_url}</a></div>",lat:{network_lat},lng:{network_lng}});
</script>
//////////////////////////////
var map;
var markers=[];
var bounds;
function initialize() {
	var myLatlng = new google.maps.LatLng(51.05866,3.713379);
	var myOptions = {
		zoom: 8,
		center: myLatlng,
		streetViewControl: false,
		scrollwheel:false,
        mapTypeId: google.maps.MapTypeId.ROADMAP  
	}
	map = new google.maps.Map(document.getElementById("gmap"), myOptions);
    bounds = new google.maps.LatLngBounds();
    mapReady();
}
function mapReady() {
    for(var i=0;i<network.length;i++){
        addPoint(network[i]);
    }
    map.setCenter( bounds.getCenter(), map.fitBounds(bounds));
}
function addPoint(data) { 
    var point = new google.maps.LatLng(data.lat,data.lng);
    var marker = new google.maps.Marker({
        position: point,
        map: map,
        title: data.title
    });
    markers.push(marker);
    bounds.extend(point);
    var infowindow = new google.maps.InfoWindow({
        content:data.address
    });
    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(map,marker);
    });
}
function loadScript() {
	var script = document.createElement("script");
	script.type = "text/javascript";
	script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";
	document.body.appendChild(script);
}
window.onload = loadScript;

Initial URL


Initial Description
A complete Google maps example with multiple markers and infowindows

Initial Title
Full Google maps

Initial Tags
google

Initial Language
JavaScript