किसी दिए गए त्रिज्या के अंदर सभी मार्करों को ढूंढना

Question

इनपुट: एक विशिष्ट समन्वय (अक्षांश और देशांतर) और त्रिज्या आउटपुट: मार्करों की दी गई सूची से उस सर्कल के नीचे रहने वाले सभी मार्करों को प्रदर्शित करना।

मैं गूगल मैप्स में यह कैसे कर सकते?

Answer 1

बस सभी मार्करों आप पुनरावृति और निम्न फ़ंक्शन का उपयोग मार्कर के लिए विशिष्ट समन्वय से दूरी पाने के लिए: computeDistanceBetween():

इस दूरी की गणना करने के लिए, computeDistanceBetween() फोन इसे पारित दो LatLng ऑब्जेक्ट्स।

मुझे इसे here पर मिला। फिर बस उन सभी मार्करों को फ़िल्टर करें जो पर्याप्त रूप से बंद हो जाते हैं।

Answer 2

जवाब इस सवाल का दिया देखें: Google Maps Api v3 - find nearest markers

आप मूल रूप से मार्करों के अपने सरणी के माध्यम से पाश की जरूरत है, और अपनी खोज त्रिज्या का प्रतिनिधित्व एक सूत्र चक्र के केंद्र का प्रयोग कर एक भी बिंदु से उनकी दूरी की गणना करने के ()।

तो आप किसी भी मार्कर जो त्रिज्या से आगे की दूरी पर हैं बाहर कर सकते हैं, विज्ञापन आप मार्करों जो चक्र के अंदर कर रहे हैं की सूची के साथ छोड़ दिया जाएगा।

Answer 3

geometry library लोड करें और अपने केंद्र बिंदु से प्रत्येक मार्कर की दूरी को खोजने के लिए computeDistanceBetween() का उपयोग करें।

दूरी के दायरे में है, तो मार्कर प्रदर्शित करते हैं।

Answer 4

var targetLat=marker.getPosition().lat(); 
var targetLng=marker.getPosition().lng(); 

var targetLoc = new GLatLng(targetLat,targetLng); 

var center= new GLatLng(centerLat, centerLng); 

var distanceInkm=center.distanceFrom(targetLoc)/1000; 

if(distanceInkm < radius){ 
// To add the marker to the map, call setMap(); 
marker.setMap(map); 
} 

Answer 5

यहाँ एक काम कर उदाहरण है। नक्शे को क्लिक करें चयनित दायरे के साथ एक त्रिज्या आकर्षित करने के लिए है और यह all_locations उदाहरण सरणी से सभी मार्करों जो त्रिज्या के अंदर गिर नज़र आए। त्रिज्या केंद्र से मीटर में दूरी देखने के लिए मार्कर पर क्लिक करें। (उदाहरण के मार्कर को देखने के लिए न्यूयॉर्क के दूसरे स्ट्रीट के आसपास कहीं क्लिक करें - नक्शे पहले से ही उस स्थान पर केंद्रित है)

var map = null; 
 
    var radius_circle = null; 
 
    var markers_on_map = []; 
 
    
 
    //all_locations is just a sample, you will probably load those from database 
 
    var all_locations = [ 
 
\t {type: "Restaurant", name: "Restaurant 1", lat: 40.723080, lng: -73.984340}, 
 
\t {type: "School", name: "School 1", lat: 40.724705, lng: -73.986611}, 
 
\t {type: "School", name: "School 2", lat: 40.724165, lng: -73.983883}, 
 
\t {type: "Restaurant", name: "Restaurant 2", lat: 40.721819, lng: -73.991358}, 
 
\t {type: "School", name: "School 3", lat: 40.732056, lng: -73.998683} 
 
    ]; 
 

 
    //initialize map on document ready 
 
    $(document).ready(function(){ 
 
     var latlng = new google.maps.LatLng(40.723080, -73.984340); //you can use any location as center on map startup 
 
     var myOptions = { 
 
     zoom: 14, 
 
     center: latlng, 
 
     mapTypeControl: true, 
 
     mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
 
     navigationControl: true, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
     }; 
 
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
 
\t 
 
\t google.maps.event.addListener(map, 'click', showCloseLocations); 
 
    }); 
 
    
 
    function showCloseLocations(e) { 
 
    \t var i; 
 
    \t var radius_km = $('#radius_km').val(); 
 
    \t var address = $('#address').val(); 
 

 
    \t //remove all radii and markers from map before displaying new ones 
 
    \t if (radius_circle) { 
 
    \t \t radius_circle.setMap(null); 
 
    \t \t radius_circle = null; 
 
    \t } 
 
    \t for (i = 0; i < markers_on_map.length; i++) { 
 
    \t \t if (markers_on_map[i]) { 
 
    \t \t \t markers_on_map[i].setMap(null); 
 
    \t \t \t markers_on_map[i] = null; 
 
    \t \t } 
 
    \t } 
 
\t 
 
    \t var address_lat_lng = e.latLng; 
 
    \t radius_circle = new google.maps.Circle({ 
 
    \t \t center: address_lat_lng, 
 
    \t \t radius: radius_km * 1000, 
 
    \t \t clickable: false, 
 
    \t \t map: map 
 
    \t }); 
 
\t if(radius_circle) map.fitBounds(radius_circle.getBounds()); 
 
    \t for (var j = 0; j < all_locations.length; j++) { 
 
    \t \t (function (location) { 
 
    \t \t \t var marker_lat_lng = new google.maps.LatLng(location.lat, location.lng); 
 
    \t \t \t var distance_from_location = google.maps.geometry.spherical.computeDistanceBetween(address_lat_lng, marker_lat_lng); //distance in meters between your location and the marker 
 
    \t \t \t if (distance_from_location <= radius_km * 1000) { 
 
    \t \t \t \t var new_marker = new google.maps.Marker({ 
 
    \t \t \t \t \t position: marker_lat_lng, 
 
    \t \t \t \t \t map: map, 
 
    \t \t \t \t \t title: location.name 
 
    \t \t \t \t }); 
 
    \t \t \t \t google.maps.event.addListener(new_marker, 'click', function() { 
 
    \t \t \t \t \t alert(location.name + " is " + distance_from_location + " meters from my location"); 
 
    \t \t \t \t }); 
 
    \t \t \t \t markers_on_map.push(new_marker); 
 
    \t \t \t } 
 
    \t \t })(all_locations[j]); 
 
    \t } 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
 
     <script type="text/javascript"> 
 
     google.load("maps", "3",{other_params:"sensor=false&libraries=geometry"}); 
 
     </script> 
 

 
<body style="margin:0px; padding:0px;" > 
 
    
 
<select id="radius_km"> 
 
\t <option value=1>1km</option> 
 
\t <option value=2>2km</option> 
 
\t <option value=5>5km</option> 
 
\t <option value=30>30km</option> 
 
</select> 
 
<div id="map_canvas" style="width:500px; height:300px;"> 
 
</body>