Affichage des adresses stockées dans bdd sur la carte

Fermé
sarra1988 Messages postés 7 Date d'inscription samedi 23 août 2014 Statut Membre Dernière intervention 28 août 2014 - 26 août 2014 à 15:36
sarra1988 Messages postés 7 Date d'inscription samedi 23 août 2014 Statut Membre Dernière intervention 28 août 2014 - 28 août 2014 à 15:38
Bonjour,

Je réalise une tache dans un projet qui consiste à afficher des adresses sur la carte avec l'api google maps. j'ai essayé plusieurs tutoriels mais le problème n'est pas résolu.
Aidez moi s'il vous plait car je suis bloqué à cet étape depuis 3 jours.
Voici le code:
<script>
var map; // Google map object

// Initialize and display a google map
function Init()
{
// Create a Google coordinate object for where to initially center the map
var latlng = new google.maps.LatLng( 36.8189700, 10.1657900); // Tunis

// Map options for how to display the Google map
var mapOptions = {
zoom: 6,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};

// Show the Google map in the div with the attribute id 'map-canvas'.
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

downloadUrl("xml/test.xml", function(data) {
var markers = data.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {


var geocoder = new google.maps.Geocoder(); // instantiate a geocoder object

// Get the user's inputted address
var adresse = markers[i].getAttribute("adresse");

// Make asynchronous call to Google geocoding API
geocoder.geocode( { 'address': adresse }, function(results, status) {
var addr_type = results[0].types[0]; // type of address inputted that was geocoded
if ( status == google.maps.GeocoderStatus.OK )
var marker = createMarker(adresse, results[0].geometry.location);

else
alert("Geocode was not successful for the following reason: " + status);
});

}
});

}
google.maps.event.addDomListener( window, 'load', Init );

// Call the method 'Init()' to display the google map when the web page is displayed ( load event )

//creation de marker
function createMarker(adresse, latlng) {
var marker = new google.maps.Marker({position: latlng, map: map});
google.maps.event.addListener(marker, "click", function() {
if (infowindow) infowindow.close();
infowindow = new google.maps.InfoWindow({content: adresse});
infowindow.open(map, marker);
});
return marker;
}
</script>
A voir également:

3 réponses

mr_demonicon Messages postés 828 Date d'inscription dimanche 20 juillet 2014 Statut Membre Dernière intervention 9 avril 2016 126
27 août 2014 à 00:28
Utilisez plutot google maps engine: http://www.google.com/...
0
sarra1988 Messages postés 7 Date d'inscription samedi 23 août 2014 Statut Membre Dernière intervention 28 août 2014 1
27 août 2014 à 11:32
Oui, je sais que je peux utiliser google maps engine, mais j'aimerais bien afficher les adresses stockées dans une base de données sans coordonnées GPS à travers un scipt.
j' ai essayé mais je ne comprends ou l'endroit de faute dans le code ci dessus.
Merci bien de m'aider.
0
sarra1988 Messages postés 7 Date d'inscription samedi 23 août 2014 Statut Membre Dernière intervention 28 août 2014 1
28 août 2014 à 15:38
Bonjour,
j'ai essayé d'afficher des marqueurs sur la carte google maps en utilisant adresses dans un fichier xml mais rien ne s'affiche.
ne ne sais pas la cause.
S'il vous plait, j'ai besoin d'aide car je suis bloquée à ce stade durant les jours derniers.
voici mon code source:
// script javascript

<script type="text/javascript">
var geocoder;
var marker;
var add = new Array(); // Tableau d'adresses
var map;
function initialize() {

var myLatlng = new google.maps.LatLng(36.8189700, 10.1657900);
var myOptions = {
zoom: 6,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

function showAddress(address) // Fonction permettant de créer des markers en fonctions des adresses
{
if (geocoder)
{
geocoder.getLatLng(address, function(point)
{
if (!point) {alert(address + " not found");} // Adresse non connue par Google Maps
else {

var marker = new google.maps.marker(point); // Initialisation d'un marker
map.addOverlay(marker); // Affichage du marker

}
});
}
}

GDownloadUrl("xml/test.xml", function(data) // Fichier xml contenant les valeurs de la BDD
{
var xml = Xml.parse(data);
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++)
{
var add = new Array(); // Tableau adresse

add = markers[i].getAttribute("adresse"); // Valeur de l'attribut adresse du fichier xml

showAddress(adds); //Création du marker en fonction de l'adresse
}
});
}// fin de fonction initialize

</script>

// code html
<body onload="initialize()">
<div id="map_canvas" style="width:500px; height:600px"></div>
</body>

// fichier xml

<?xml version="1.0"?>
<markers>
<marker adresse="le golf Ben Aoun Hamamet" ville="Hamamet" />
<marker adresse="Oueled bousaad Gtar+gafsa" />
</markers>
0