Bonjour,
Autant en php je me débrouille mais alors JS est ma bête noire, pourtant ça se ressemble mais bon... bref.... donc je fais appel aux bonnes âmes qui m'aideront, je l'espère à me dépatouiller !!!
Surement tellement simple pour certains...
Voici mon besoin, j'ai dans ma base de données, la liste des centres que je dois afficher sur la carte. Je souhaite pouvoir afficher le marqueur en fonction de l'adresse postale si les données GPS sont absentes.
J'affiche bien les centres qui ont les coordonnées GPS, par contre les autres NON
SVP Help
Je me suis servi de la doc google et autres infos trouver sur le web.
merci
Autant en php je me débrouille mais alors JS est ma bête noire, pourtant ça se ressemble mais bon... bref.... donc je fais appel aux bonnes âmes qui m'aideront, je l'espère à me dépatouiller !!!
Surement tellement simple pour certains...
Voici mon besoin, j'ai dans ma base de données, la liste des centres que je dois afficher sur la carte. Je souhaite pouvoir afficher le marqueur en fonction de l'adresse postale si les données GPS sont absentes.
J'affiche bien les centres qui ont les coordonnées GPS, par contre les autres NON
SVP Help
Je me suis servi de la doc google et autres infos trouver sur le web.
merci
var customLabel = {
formation: {
label: 'F'
},
centre: {
label: 'C'
}
};
var geocoder;
function initMap() {
geocoder = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById('map'), {
center: new google.maps.LatLng(43.5296809,5.0933665),
zoom: 8
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP or XML file
downloadUrl('XMLCentre.php', function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName('marker');
Array.prototype.forEach.call(markers, function(markerElem) {
var name = markerElem.getAttribute('name');
var addresse = markerElem.getAttribute('addresse');
var ville = markerElem.getAttribute('cp')+' '+markerElem.getAttribute('ville');
var telephone = markerElem.getAttribute('telephone');
var type = markerElem.getAttribute('type');
var point = new google.maps.LatLng(
parseFloat(markerElem.getAttribute('lat')),
parseFloat(markerElem.getAttribute('lng')));
if (!point) {
var address = adresse+' '+ville;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == 'OK') {
var point = results[0].geometry.location;
}
});
}
var infowincontent = document.createElement('div');
var strong = document.createElement('strong');
strong.textContent = name
infowincontent.appendChild(strong);
infowincontent.appendChild(document.createElement('br'));
var text = document.createElement('text');
text.textContent = addresse
infowincontent.appendChild(text);
infowincontent.appendChild(document.createElement('br'));
var text = document.createElement('text');
text.textContent = ville
infowincontent.appendChild(text);
infowincontent.appendChild(document.createElement('br'));
var strong = document.createElement('strong');
strong.textContent = telephone
infowincontent.appendChild(strong);
//infowincontent.appendChild(document.createElement('br'));
//infowincontent.appendChild(document.createElement('br'));
var icon = customLabel[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
label: icon.label
});
marker.addListener('click', function() {
infoWindow.setContent(infowincontent);
infoWindow.open(map, marker);
});
});
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
