ここで、 JSFiddleデモ:
これが一つの方法だと思います。 Google MapV3APIのサークル
を使用できます 中心点または現在の場所から境界を作成します。 setRadius(radius:number)
を使用して、円の半径をメートル単位で指定できます。 。作成されたサークルを使用して、マーカーをループし、LatLngBoundsであるCircleのgetBoundsオブジェクト
マーカーが範囲内にあるかどうかを確認します。
先に進んで、マップ上に5つのポイントがある小さなデモを作成しました。[円の作成]ボタンをクリックすると、最初のマーカーが中心点になり、半径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);
}