Ho una pagina web che sfruttando le api di google crea una mappa. Io vorrei che su questa mappa venissero inseriti dei Marker.
il codice della pagina web è il seguente
Codice PHP:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps API v3: geocoding</title>
<style type="text/css">
html, body { margin:0; padding:0; width:100%; height:100%; }
body {
background:#FFFFFF;
color:#000000;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
line-height:150%;
text-align:center;
}
#map {
width:100%;
height:95%; }
input { width:250px; }
#tooltip { padding:10px; text-align:left; }
#tooltip p { padding:0; margin:0 0 5px 0; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript">
var createMap = function() {
var lat = new Array();
var long = new Array();
var descr = new Array();
lat[0] = "43.809312";
long[0] = "11.251992";
descr[0] = "Careggi";
lat[1] = "43.758606";
long[1] = "11.203076";
descr[1] = "Torregalli";
lat[2] = "43.733835";
long[2] = "11.296971";
descr[2] = "Ponte a Niccheri";
searchAddress();
var address = document.getElementById("address").value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {'address': address}, function(results,status) {
if (status == google.maps.GeocoderStatus.OK) {
var options = {
zoom: 12,
center: results[0].geometry.location,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map'), options);
var i = 0;
for (i=0; i<lat[1].length; i++) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat[i],long[i]),
map: map,
title: descr[i]
});}
var marker = new google.maps.Marker(
{
position: results[0].geometry.location,
map: map,
title: results[0].formatted_address
}
);
var tooltip = '<div id="tooltip">'+
'
formatted_address:
'+ results[0].formatted_address+'</p>'+ '
latLng:
'+ results[0].geometry.location+'</p>'+ '</div>';
var infowindow = new google.maps.InfoWindow({
content: tooltip
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
} else {
alert("Problema nella ricerca dell'indirizzo: " + status);
}
});
}
var searchAddress = function(){
document.getElementById("submit").onclick = function() {
createMap();
}
}
window.onload = createMap;
</script>
</head>
<body>
<div>
<input id="address" type="textbox" value="Firenze">
<input id="submit" type="button" value="trova indirizzo sulla mappa">
</div>
<div id="map"></div>
</body>
</html>
scusate la formattazione schifosa. Comunque è il codice preso da qua con l'aggiunta dell'array e del ciclo che crea i marker.
Ovviamente il codice che apre la pagina è
codice:
WebBrowser1.Navigate("http://www.prova.it/map.asp")
WebBrowser1.Document.GetElementById("address").InnerText = "indirizzo di prova"
WebBrowser1.Document.GetElementById("submit").Focus()
SendKeys.Send(ControlChars.Cr)
La pagina funziona bene ma capirete che l'array di volta in volta cambia e i dati di latitudine e longitudine sono in una tabella di un un database. La soluzione più semplice sarebbe che la pagina andasse direttamente a leggere il database e si prendesse le coordinate che le servono, ma mi è stato detto che al 90% non si potrà fare.
Allora pensavo che questo array si potesse passare dal controllo webbrowser.
E' possibile?
Rispondi quotando