Ok en gros j'utilise mapbox
Mon but , calculer la distance entre MA position (qui est géolocalisé) et le marker numero 1.
Avec cette distance en gros si la personne (moi/vous) et à plus de 10 km du point, une alert s'affiche "désolé vous êtes trop loin du point"
franchement je suis assez perdu si quelqu'un veut try pour le fun de le faire ou m'aider, merci .
<head>
<script type="text/javascript" src='https://api.mapbox.com/mam/mapbox.js/v2.4.0/mapbox.js'></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://maps.stamen.com/js/tile.stamen.js?v1.1.2"></script>
<script type="text/javascript" src="./js/lib/leaflet-providers.js"></script>
</head>
<body>
<div id='map'></div>
<script>
//token mapbox
L.mapbox.accessToken = 'pk.eyJ1Ijoia3dpeiIsImEiOiJjaW1oaXh2YnYwMDBld2FseTI4dnA1ZnNrIn0.9_gj59JrKPJglEvYAgB-TA';
var geolocate = document.getElementById('geolocate');
var map = L.mapbox.map('map', 'mapbox.streets','mapbox.dc-markers');
var featureLayer = L.mapbox.featureLayer().addTo(map);
// This uses the HTML5 geolocation API, which is available on
// most mobile browsers and modern browsers, but not in Internet Explorer
//
// See this chart of compatibility for details:
// http://caniuse.com/#feat=geolocation
if (!navigator.geolocation) {
geolocate.innerHTML = 'Geolocation non disponnible';
} else {
geolocate.onclick = function (e) {
e.preventDefault();
e.stopPropagation();
map.locate();
};
}
// Once we've got a position, zoom and center the map
// on it, and add a single marker.
map.on('locationfound', function(e) {
map.fitBounds(e.bounds);
var mymarker = myLayer.setGeoJSON({
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [e.latlng.lng, e.latlng.lat]
},
properties: {
'description':'',
'title': 'vous êtes ici',
'marker-color': '#ff8888',
'marker-symbol': 'star'
}
});
// And hide the geolocation button
geolocate.parentNode.removeChild(geolocate);
});
L.tileLayer.provider('Stamen.Watercolor').addTo(map);
var myLayer = L.mapbox.featureLayer().addTo(map);
// If the user chooses not to allow their location
// to be shared, display an error message.
map.on('locationerror', function() {
geolocate.innerHTML = 'Position could not be found';
});
//pointnumero 1
L.marker([ 43.3089981,5.369446 ], {
icon: L.mapbox.marker.icon({
'marker-size': 'small',
'marker-symbol': 'star',
'marker-color': '#fa0'
})
}).addTo(map);
</script>
</body>
j'ai trouvé de la doc mais j'ai du mal a comprendre, et la doc mapbox est peut être mal adapté http://stackoverflow.com/questions/13840516/how-to-find-my-distance-to-a-known-location-in-javascript
https://www.mapbox.com/mapbox.js/example/v1.0.0/marker-distances/