0

編集: 質問=「配列をループして、各位置(経度/緯度)が現在のビューポート内に直接あるかどうかを確認する方法はありますか」(ビューポート内のすべてのマーカーを取得できない)

背景:

場所の配列(緯度、経度、ID)があります。

したい:

  • Google マップで、location 配列を使用してマーカーを表示します。
  • ユーザーは地図をスクロール/ズームできます。
  • マップの下にボタンを配置して、ユーザーが領域を決定したときにボタンをクリックできるようにします。コードは、ビューポート / マップの境界内に含まれる (場所の配列から) ID を返します

Googleには.containsがあるので、次のようなものでそれを使用できる可能性があると思います

map.getBounds().containsそして、どういうわけか各marker.getPosition()を参照します

しかし、配列をループして、各位置(経度/緯度)が現在のビューポート内に直接あるかどうかを確認する方法があるのだろうか

4

2 に答える 2

2

あなたはこのようなことを意味します(テストされていません)、 map は google.maps.Map オブジェクトであり、スコープ内にある必要があります。markerArray は、マーカーの配列です。

for (var i=0; i< markersArray.length; i++) {
   if (map.getBounds().contains(markersArray[i].getPosition())) {
      // the marker is in view
   } else {
      // the marker is not in view
   } 
}
于 2013-03-12T13:59:53.247 に答える
0

http://jsfiddle.net/UA2g2/1/

geocodezip に感謝します。配列をループして解決する方法を教えてくれました。これが最も効率的な方法かどうかはわかりませんが、私が望むことを行うと思われるコードをいくつかまとめました.上記の jsfiddle を確認してコンソールを表示すると、いつ、どのポイントがビューポートにあるかがログに記録されていることがわかります. .

$(document).ready(function(){

  var myOptions = {
  center: new google.maps.LatLng(51, -2),
  zoom: 9,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  var storeArray = new Array(["51.38254", "-2.362804", "ID1"], ["51.235249", "-2.297804","ID2"], ["51.086126", "-2.910767","ID3"]);

  google.maps.event.addListener(map, 'idle', function() {

      for (i = 0; i < storeArray.length; i++) {  
            marker = new google.maps.Marker({
            position: new google.maps.LatLng(storeArray[i][0], storeArray[i][1]),
            map: map
         });
      }

      for (var i=0; i<storeArray.length; i++) {
          if (map.getBounds().contains(new google.maps.LatLng(storeArray[i][0], storeArray[i][1]))) {
              console.log("marker: " + storeArray[i][2]);
            }
        } 

  });


});
于 2013-03-13T19:04:51.733 に答える