Прежде всего, я использую Google Maps API v3. У меня есть одна большая карта, которая отображает все результаты, полученные из базы данных, теперь мне нравится реализовать функцию, которая показывает радиус ближайших результатов в X километрах от текущего местоположения (обслуживается геолокацией HTML5).
Поскольку карта содержит все результаты, я хочу иметь возможность добавлять X километров, после чего она будет представлена, что результаты будут возвращены ближайшими результатами в соответствии с текущим местоположением пользователя. Затем вся карта должна удалить все маркеры без радиуса действия , оставив маркеры в радиусе X километров.
Я запрашиваю эффективный код, учебник или статью о том, как это сделать.
Здесь JSFiddle Demo:
Я полагаю, что это один из способов сделать это. Вы можете использовать круг API Google Map V3 для создания границ от вашей центральной точки или текущего местоположения. Вы можете указать радиус круга в метрах с помощью setRadius(radius:number)
. С созданным кругом вы можете прокручивать маркеры и видеть, находятся ли они в пределах круга, используя объект getBounds Circle, который является LatLngBounds и проверяет, находится ли маркер в пределах границы или нет.
Я пошел дальше и создал небольшую демоверсию, на которой есть пять точек на карте, и когда вы нажимаете кнопку создания круга, она сделает первый маркер центральной точкой и рисует круг с радиусом 5000 и отфильтровывает маркеры, которые не связаны с использованием метода, описанного выше:
function createRadius(dist) { var myCircle = new google.maps.Circle({ center: markerArray[markerArray.length - 1].getPosition(), map: map, radius: dist, strokeColor: "#FF0000", strokeOpacity: 0.8, strokeWeight: 2, fillColor: "#FF0000", fillOpacity: 0.35 }); var myBounds = myCircle.getBounds(); //filters markers for(var i=markerArray.length;i--;){ if(!myBounds.contains(markerArray[i].getPosition())) markerArray[i].setMap(null); } map.setCenter(markerArray[markerArray.length - 1].getPosition()); map.setZoom(map.getZoom()+1); }
Это решение имеет только один главный недостаток – он извлекает данные в прямоугольник, а не в круг.
Если вы не хотите запрашивать больше данных, чем требуется, используйте формулу haversine в SQL:
SELECT id, (3959 * acos( cos(radians(37)) * cos(radians(lat)) * cos(radians(lng) - radians(-122)) + sin(radians(37)) * sin(radians(lat)) ) ) AS distance FROM markers HAVING distance < 25 ORDER BY distance LIMIT 0 , 20;
Также проверьте Создание локатора хранилища с помощью PHP, MySQL и Google Maps