Bonjour, je suis en train de monter un site et y ajouter quelques fonctions pour cela j'aimerais trouver des codes source pour.
Exemple: le point (A) représente l'utilisateur
Le point (B) représente mon adresse bureau
ce que je cherche est que lorsque l'utilisateur clique sur le bouton (localiser), automatiquement le point (A) soit localisé par rapport au point (B) tout en montrant au point (A) quel chemin prendre et quel est la distance a parcourir tout cela avec google maps.
de ma part j'ai trouver quelques codes source que j'ai testés.
<html>
<head>
<style type="text/css">
#map {
width: 50%;
height: 300px;
}
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
// Carte Google Map
google.maps.event.addDomListener(window, 'load', init);
function init(){
// Options de base de la Google Map
var mapOptions = {
// Zoom au depart sur la carte (obligatoire)
zoom: 10,
// La latitude et longitude pour centrer la carte (obligatoire)
center: new google.maps.LatLng(33.4073896, 2.77813), // Alger
// Placez ici le style de map qui vous plait.
styles: [{"featureType":"landscape","stylers":[{"hue":"#FFBB00"},{"saturation":43.400000000000006},{"lightness":37.599999999999994},{"gamma":1}]},{"featureType":"road.highway","stylers":[{"hue":"#FFC200"},{"saturation":-61.8},{"lightness":45.599999999999994},{"gamma":1}]},{"featureType":"road.arterial","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":51.19999999999999},{"gamma":1}]},{"featureType":"road.local","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":52},{"gamma":1}]},{"featureType":"water","stylers":[{"hue":"#0078FF"},{"saturation":-13.200000000000003},{"lightness":2.4000000000000057},{"gamma":1}]},{"featureType":"poi","stylers":[{"hue":"#00FF6A"},{"saturation":-1.0989010989011234},{"lightness":11.200000000000017},{"gamma":1}]}]
};
// Carte Google Map personnalise Tonton du Web
// We are using a div with id="map" seen below in the <body>
var mapElement = document.getElementById('map');
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
// Let's also add a marker while we're at it
var marker = new google.maps.Marker({
position: new google.maps.LatLng(33.273075, 3.194862),
map: map,
title: 'ٌreg'
});
}
</script>
</head>
<body>
<!-- The element that will contain our Google Map. This is used in both the Javascript and CSS above. -->
<div id="map"></div>
</body>
</html>