// ajax-script nodig voor map24 wordt via de DOM in de head geplaatst includeScript("http://api.map24.com/ajax/1.2/?init=default"); // hierin worden de hotspots gestoken vanuit de pagina via een query var markers = new Array(); // naam van de gemeente var townName; // lijst van deelgemeentes: nodig omdat het zoeken op een straatnaam vereist dat je in de juiste deelgemeente zoekt var deelgemeentes; // zoom-niveau voor als je naar een locatie "vliegt". Hoe kleiner dit getal hoe dichterbij ! var zoomClose = 500; var map = null; var mrcContainer = null; var prevEnabledMarker; var prevDocId; var imageURL; var streetname; var borderCoordsTmp = new Array(); var polyColor; var expectedResult; var found; var mapWidth = 400; var mapHeight = 400; // wordt uitgevoerd na laden van de pagina function goMap24() { // via dit object gebeurt de communicatie met de map24 webservice mrcContainer = new Map24.Webservices.Request.MapletRemoteControl(); // cre�er een map. MapArea =

in de html-code van de pagina // AppKey = applicationkey kan je aanvragen op map24 website map = Map24.Webservices.getMap24Application({ AppKey: "FJXbdc6799ff9b91b19070fba1e1571fX13", MapArea: document.getElementById("maparea"), Maptype: "JAVA", MapWidth: mapWidth, MapHeight: mapHeight, MRC: mrcContainer }); // "overzicht" item toevoegen aan lijst var table = document.getElementById("markerlist"); var row = table.insertRow(-1); cell = row.insertCell(-1); cell.innerHTML = "Overzicht"; // hotspots aan de lijst toevoegen var cnt=0; for (i=0; i zowel voor Internet Explorer als firefox/mozilla function setBodyOnLoad() { var browserName=navigator.appName; if (browserName == "Microsoft Internet Explorer") { var body_tag = document.getElementsByTagName('body').item(0); body_tag.setAttribute('onload', function () { goMap24(); return false; }); } else { var html_doc = document.getElementsByTagName('head').item(0); var js = document.createElement('script'); html_doc.appendChild(js); js.setAttribute('language', 'javascript'); js.setAttribute('type', 'text/javascript'); js.innerHTML = "goMap24();"; } } // om grenzen van de gemeente extern toe te voegen function addPolygonCoord( lon, lat ) { borderCoordsTmp.push({ Lon: lon, Lat: lat }); } // om kleur van grenzen in te stellen function setPolyColor ( r, g, b, a ) { polyColor = { R:r, G:g, B:b, A:a }; } // zoek een locatie op, en beweeg camera naar daar. Werkt voor meerdere deelgemeentes. function geocode( addressString ){ expectedResult = addressString; found = false; // verwijder de vorige resultaten var container = document.getElementById('results'); for (i=container.childNodes.length-1; i>=0;i--) { container.removeChild(container.childNodes[i]); } // zoek naar straatnaam voor elke deelgemeente for (var i=0;i"; document.getElementById("results").appendChild(item); */ if ( alternative.PropertiesMajor["Street"].toLowerCase() == expectedResult.toLowerCase() ) { // zet kruisje bij de straat die het gehaald heeft //item.innerHTML += " x"; if (!found) { flyTo(alternative); found=true; } } } } } } // zoek een locatie op, en beweeg camera naar daar. Maakt gebruik van "fuzzy search" // NIET per deelgemeente. Geeft gewoon het resultaat terug van geocoder dat volgens hem er het meest op lijkt function geocodeFuzzy( addressString ){ map.Webservices.sendRequest( new Map24.Webservices.Request.MapSearchFree(map, { SearchText: addressString, MaxNoOfAlternatives: 1 }) ); // callback functie voor als een resultaat gevonden wordt map.onMapSearchFree = function( event ){ flyTo(event.Alternatives[0]); } } // beweeg de camera naar gevonden SearchAlternative function flyTo(firstResult) { streetname = firstResult.PropertiesMajor["Street"]; town = firstResult.PropertiesMajor["City"]; var lon = firstResult.Coordinate.Longitude; var lat = firstResult.Coordinate.Latitude; // als niets gevonden werd, toon een berichtje if (streetname == "") { document.getElementById("noresult").style.display = "inline"; } else { document.getElementById("noresult").style.display = "none"; // plaats een label op de positie van de straat met als tekst de straatnaam mrcContainer.push( new Map24.Webservices.MRC.DeclareMap24Label({ Anchor: "CENTER", Coordinate: new Map24.Coordinate( lon, lat ), Color: new Map24.Color( { R:0, G:0, B:0, A:255 } ), BgColor: new Map24.Color( { R:255, G:255, B:255, A:200 } ), BorderColor: new Map24.Color( { R:200, G:0, B:0, A:255 } ), MapObjectID: "locationMarker", Text: streetname }) ); // activeer dit label mrcContainer.push( new Map24.Webservices.MRC.ControlMapObject({ Control: "ENABLE", MapObjectIDs: "locationMarker" }) ); //beweeg camera naar locatie en zoom in mrcContainer.push( new Map24.Webservices.MRC.SetMapView({ Coordinates: new Map24.Coordinate( lon, lat ), ClippingWidth: new Map24.Webservices.ClippingWidth( { MinimumWidth: zoomClose } ) }) ); // verstuur requests map.Webservices.sendRequest( mrcContainer ); // -1 = aanduiding voor marker die op een straat staat prevEnabledMarker = -1; } } // Grenzen van de gemeente aanduiden function addPolygonOverlay(){ var borderCoords = new Array(); for (i=0; i" + " > " + markers[index].label + ""; } // beweeg de camera naar een marker van een hotspot function moveToLocation(index) { // verberg vorige getoonde marker // als vorige een marker was zonder co�rdinaten (bvb een straat) if (prevEnabledMarker == -1) { mrcContainer.push( new Map24.Webservices.MRC.ControlMapObject({ Control: "DISABLE", MapObjectIDs: "locationMarker" }) ); } // als vorige met co�rdinaten was else if (prevEnabledMarker != null) { mrcContainer.push( new Map24.Webservices.MRC.ControlMapObject({ Control: "DISABLE", MapObjectIDs: "marker" + prevEnabledMarker }) ); } prevEnabledMarker = index; // voeg marker toe als geen co�rdinaten gegeven zijn maar plaatsnaam if ( markers[index].longitude == null || markers[index].lattitude == null ) { map.Webservices.sendRequest( new Map24.Webservices.Request.MapSearchFree(map, { SearchText: markers[index].location, MaxNoOfAlternatives: 1 }) ); // icoontje voor marker instellen. als null wordt een rood vlagske gebruikt imageURL = markers[index].img; map.onMapSearchFree = function( event ){ var firstResult = event.Alternatives[0]; var lon = firstResult.Coordinate.Longitude; var lat = firstResult.Coordinate.Latitude; // als geen afbeelding wordt meegegeven gebruik pushpin-symbooltje van map24 if (imageURL == null) { mrcContainer.push( new Map24.Webservices.MRC.DeclareMap24Location({ MapObjectID: "locationMarker", Coordinate: new Map24.Coordinate( lon, lat ), SymbolID: 10281 }) ); } //gebruik afbeelding else { mrcContainer.push( new Map24.Webservices.MRC.DeclareMap24Location({ MapObjectID: "locationMarker", Coordinate: new Map24.Coordinate( lon, lat ), LogoURL: imageURL, SymbolID: 10286 }) ); } // activeer marker mrcContainer.push( new Map24.Webservices.MRC.ControlMapObject({ Control: "ENABLE", MapObjectIDs: "locationMarker" }) ); // beweeg camera naar postie van marker en zoom in mrcContainer.push( new Map24.Webservices.MRC.SetMapView({ Coordinates: new Map24.Coordinate( lon, lat ), ClippingWidth: new Map24.Webservices.ClippingWidth( { MinimumWidth: zoomClose }) }) ); // verstuur request naar server map.Webservices.sendRequest( mrcContainer ); prevEnabledMarker = -1; } // toon info-venster var id = markers[index].id; if (prevDocId != null) document.getElementById("info"+prevDocId).style.display = "none"; document.getElementById("info"+id).style.display = "block"; prevDocId = id; } // toon marker en ga naar daar als co�rdinaten meegegeven zijn else { // activeer marker mrcContainer.push( new Map24.Webservices.MRC.ControlMapObject({ Control: "ENABLE", MapObjectIDs: "marker" + index }) ); // beweeg camera naar postie van marker en zoom in mrcContainer.push( new Map24.Webservices.MRC.SetMapView({ Coordinates: new Map24.Coordinate( markers[index].longitude, markers[index].lattitude ), ClippingWidth: new Map24.Webservices.ClippingWidth( { MinimumWidth: zoomClose }) }) ); // verstuur request naar server map.Webservices.sendRequest( mrcContainer ); } } function moveToObject(objectId) { mrcContainer.push( new Map24.Webservices.MRC.SetMapView({ MapObjectIDs: objectId, ClippingWidth: new Map24.Webservices.ClippingWidth( { MinimumWidth: zoomClose }) }) ) map.Webservices.sendRequest( mrcContainer ); }