Chủ Nhật, 5 tháng 1, 2014
Google map Change Icon in radius
Sử dụng thư viện từ google
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places,visualization&v=3.exp"></script>
Thêm đoạn script
<script>
var map;
var infoWindow;
var service;
var distanceRange=10000;//1km
var types=['bank'];
var iconInRange="in_range.png";
var iconOutRange="out_range.png";
var mylocation = new google.maps.LatLng(-33.8668283734, 151.2064891821);
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: mylocation,
zoom: 10,
});
infoWindow = new google.maps.InfoWindow();
service = new google.maps.places.PlacesService(map);
google.maps.event.addListenerOnce(map, 'bounds_changed', performSearch);
}
function performSearch() {
var request = {
bounds: map.getBounds(),
types:types
};
service.radarSearch(request, callback);
}
function callback(results, status) {
if (status != google.maps.places.PlacesServiceStatus.OK) {
alert(status);
return;
}
for (var i = 0, result; result = results[i]; i++) {
createMarker(result);
}
}
function createMarker(place) {
var distance1=1000;//1km
//BEGIN DISTANCE
var glatlng1 = mylocation;
var glatlng2 = place.geometry.location;
//Fucntion Distance
//alert(glatlng1.lng());
var distance1=distance(mylocation,glatlng2);
//alert(distance1);
//END DISTANCE
var marker;
//IN
if(distance1<distanceRange){
marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
icon:iconInRange
});
//alert('in');
}
//OUT
else{
marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
icon:iconOutRange
});
//alert('out');
}
google.maps.event.addListener(marker, 'click', function() {
service.getDetails(place, function(result, status) {
if (status != google.maps.places.PlacesServiceStatus.OK) {
alert(status);
return;
}
infoWindow.setContent(result.name);
infoWindow.open(map, marker);
});
});
}
//Fucntion Distance
function distance(location1,location2) {
var lat1=location1.lat();
var lon1=location1.lng();
var lat2=location2.lat();
var lon2=location2.lng();
var R = 6371; // km (change this constant to get miles)
var dLat = (lat2-lat1) * Math.PI / 180;
var dLon = (lon2-lon1) * Math.PI / 180;
var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
Math.cos(lat1 * Math.PI / 180 ) * Math.cos(lat2 * Math.PI / 180 ) *
Math.sin(dLon/2) * Math.sin(dLon/2);
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
var d = R * c;
//if (d>1) return Math.round(d)+"km";
//else if (d<=1)
return Math.round(d*1000);//meter
//return d;
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
Đăng ký:
Đăng Nhận xét (Atom)
0 nhận xét:
Đăng nhận xét