Bonjour
Je souhaiterai mettre des icones différents sur ma carte google map, je cherche depuis plusieurs jours, j'ai trouvé de nombreux sites sur le sujet surtout en anglais dommage ..... je ne maitrise pas ...!
Ma page : http://www.cambo-les-bains.net/essai/index.html
Je progresse, j'ai déja reussi à changer l' icone de base
En fait il faudrait attribuer un icone différent par point ! et la je galère.
Merci
Bonne journée
Le code :
Modifié par africa (14 Jun 2007 - 13:38)
Je souhaiterai mettre des icones différents sur ma carte google map, je cherche depuis plusieurs jours, j'ai trouvé de nombreux sites sur le sujet surtout en anglais dommage ..... je ne maitrise pas ...!
Ma page : http://www.cambo-les-bains.net/essai/index.html
Je progresse, j'ai déja reussi à changer l' icone de base
En fait il faudrait attribuer un icone différent par point ! et la je galère.
Merci
Bonne journée
Le code :
<script type="text/javascript">
//<![CDATA[
/* Variable qui va correspondre à l'affichage de la carte dans la "div" */
var map = new GMap2(document.getElementById("map"));
/* Centre la carte aux coordonnées indiquées et réalise un zoom de niveau 14 */
var point1 = new GLatLng(43.3614500 , -1.39899500);
var point2 = new GLatLng(43.3664000 , -1.41999500);
var point3 = new GLatLng(43.3545000 , -1.38900000);
var point4 = new GLatLng(43.3558000 , -1.41590000);
var point5 = new GLatLng(43.3612000 , -1.392999000);
map.setCenter(point1, 14);
map.addControl(new GMapTypeControl());
map.addControl(new GLargeMapControl());
/* nouvel icon*/
var icon = new GIcon();
icon.image = "images/icon_1.png";
icon.shadow = "images/ombre_1.png";
icon.iconSize = new GSize(19, 29);
icon.shadowSize = new GSize(34, 30);
icon.iconAnchor = new GPoint(10, 29);
icon.infoWindowAnchor = new GPoint(10, 10);
/* Fonction qui à partir d'une adresse va déterminer le point géographique */
function createInfoMarker(point, text) {
/* Création d'un marqueur */
var marker = new GMarker(point,icon);
/* Afficher le marqueur */
map.addOverlay(marker);
/* Lorsque le marqueur est cliqué, on ouvre l'info-bulle */
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(text);
});
}
/* mairie-01 */
createInfoMarker(point1, '<img src="mairie.jpg" width="150" height="112" /><br />Mairie : 05 59 93 74 30<br />OT : 05 59 29 70 25');
/* arnaga-02*/
createInfoMarker(point2, '<img src="arnaga.jpg" width="150" height="112" /><br />Arnaga : 05 59 29 83 92');
/* thermes-03 */
createInfoMarker(point3, '<img src="thermes.jpg" width="150" height="112" /><br />Thermes : 05 59 29 39 39<br />0 825 00 35 35');
/* bixta-04 */
createInfoMarker(point4, '<img src="bixta.jpg" width="150" height="112" /><br />Camping Bixta Eder <br /> 05 59 29 39 39<br />');
/* bixta-04 */
createInfoMarker(point5, '<img src="rosa.jpg" width="150" height="112" /><br />Rosa Enia<br />Chambres, studios<br /> 05 59 93 67 20<br />');
/* long/lat */
GEvent.addListener(map, "moveend", function() {
var center = map.getCenter();
document.getElementById("message").innerHTML = center.toString();
});
//]]>
</script>
Modifié par africa (14 Jun 2007 - 13:38)