Google Maps utan att använda BODY-taggen

I många kodexempel för Google Maps du finner på nätet så förutsätts det att man kan ändra i body-taggen i HTML-dokumentet. Det är inte alltid praktiskt möjligt i publiceringsverktyg och därför har jag letat och satt samman ett kodexempel som bara är att klistra in. Se bara till att peka ut en existerande del av webbsidan på raden med getElementById(”map_canvas”), där map_canvas exemplifierar ett ID för ett HTML-element på sidan.

Tänk på att regga en egen nyckel till Google Maps om du ska använda detta.

Kodexempel för Google Maps som inte behöver stöka med <body>-taggen:

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAp3SStC2eaRzLMhLBZ1UcvRQxwxldGc6r_XFN3i14hV4dItEmehT2JZ2TSlmG5aA_vEdsVPkeJxAazA" src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAp3SStC2eaRzLMhLBZ1UcvRQxwxldGc6r_XFN3i14hV4dItEmehT2JZ2TSlmG5aA_vEdsVPkeJxAazA" type="text/javascript"></script>
<script type="text/javascript"><!--
	function createMarker(point, html) {
		var marker = new GMarker(point);
		GEvent.addListener(marker, "click", function() {
			marker.openInfoWindowHtml(html);
		});
		return marker;
	}
	
	function load() { 
	if (GBrowserIsCompatible()) { 
		var map = new GMap2(document.getElementById("map_canvas")); 
		map.setCenter(new GLatLng(57.70209500480537, 11.988036632537842), 14); 
		
		//kontroller 
		map.addControl(new GSmallMapControl()); 
		map.addControl(new GMapTypeControl()); 
		
		//parken
		var point = new GLatLng(57.70209500480537, 11.988036632537842);
		var marker = createMarker(point, ´<div style="width:240px">Actionparken</div>´)
		map.addOverlay(marker);

		//Valhallaparkeringen
		var point = new GLatLng(57.70029490886586, 11.988959312438965);
		var marker = createMarker(point, ´<div style="width:240px">Parkering vid Valhallabadet</div>´)
		map.addOverlay(marker);
	} 
} 
		
		// -->
</script>
<script type="text/javascript">
<!-- 
function addLoadEvent(func) { 
var oldonload = window.onload; 
if (typeof window.onload != ´function´) { 
	window.onload = func; } 
	else { 
	window.onload = function() { 
		if (oldonload) { 
		oldonload(); } 
	func(); 
	} 
	} 
	} 
addLoadEvent(load); 
// arrange for our onunload handler to ´listen´ for onunload events 
if (window.attachEvent) { 
	window.attachEvent("onunload", function() { GUnload(); // Internet Explorer 
	}); 
	} 
	else { 
	window.addEventListener("unload", function() { GUnload(); // Firefox and standard browsers 
	}, false); } 
	// -->
</script>
	<p id="map_canvas" style="width: 500px; height: 350px"></p>

Leave a Reply Cancel reply