【Googlemap】表示しているmapの範囲だけピンする方法

仕組みとしては、データベースから取ってきた各データが今表示しているマップ内の座標に存在するかを確認し、存在すればピンを打つというものである。

具体的に見ていく。

if(Number(response[0][j]) < map_ne_lat && 
                Number(response[0][j]) > map_sw_lat && 
                Number(response[1][j]) < map_ne_lng && 
                Number(response[1][j]) > map_sw_lng){
                    lat_ex.push(Number(response[0][j]));
                    lng_ex.push(Number(response[1][j]));
                    title.push(response[2][j]);
                    open.push(response[3][j]);
                    //close.push(response[4][j]);
                    fee1.push(response[4][j]);
                    fee2.push(response[5][j]);
                    capacity.push(response[6][j]);

map_ne_lat:表示されている地図の緯度が最も高い位置の緯度の値

map_sw_lat:表示されている地図の緯度が最も低い位置の緯度の値

map_ne_lng:表示されている地図の経度が最も東の位置の経度の値

map_sw_lng:表示されている地図の経度が最も西の位置の経度の値

＊国によっては条件が変わります。

上記の条件文で、画面表示内の座標のデータのみ取得し、取得したデータのみをピンを打つ関数に投げる。

var bounds = map.getBounds();
    map_ne_lat = bounds.getNorthEast().lat();
    map_sw_lat = bounds.getSouthWest().lat();
    map_ne_lng = bounds.getNorthEast().lng();
    map_sw_lng = bounds.getSouthWest().lng();

地図の画面の枠となる位置の緯度経度は上記のプログラムで取得できる。