Blogg

Jag stötte för någon vecka sedan på ett problem när jag implementerade Google Maps i ett Thickbox-fönster. Problemet som dök upp var att Google Maps inte centrerade som jag hade angivit när jag instansierade kartan. Jag letade med ljus och lykta utan att hitta en lösning men av slump testade jag att genom parametern size sätta storleken på kartan även i kart-instansieringen. Min Google Map-implementation såg till slut ut som nedan.

var map;
var controlId = 'googlemap';
var Points = new Array();
var icon0 = new GIcon();

var centerPoint = new GLatLng(58.2692, 10.3531);
var zoomIndex = 5;

Points[0] = new Array(57.1253, 12.21586, icon0, 'A marker title', 'The popup window text', 'Marker link');
Points[1] = new Array(59.2556, 16.1235, icon0, 'A marker title', 'The popup window text', 'Marker link');

function OnPageLoad() {
	if (GBrowserIsCompatible()) {
		var mapsize = new GSize(420, 350);

		map = new GMap2(document.getElementById(controlId), { size: mapsize });
		map.setCenter(centerPoint, zoomIndex);
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());

		for (var i = 0; i < Points.length; i++) {
			var point = new GLatLng(Points[i][0], Points[i][1]);
			var icon = Points[i][2];
			var objectName = Points[i][3];
			var popuphtml = Points[i][4];
			var link = Points[i][5];

			var marker = createMarker(point, icon, objectName, popuphtml, link);
			map.addOverlay(marker);
        	}

		map.zoomToMarkers();
    	}
}

function createMarker(point, icon, objectName, popuphtml, link)
{
	var marker = new PdMarker(point);

	marker.setTooltip(objectName);

	if (link != '') {
		GEvent.addListener(marker, 'click', function() {
			// DoEvent
		});
	}

	return marker;
}

window.onload = OnPageLoad;

Notera att detta är en förenklad implementation av den jag använder. Jag använder även PdMarker för att underlätta vid centrering och zoomning.