GoogleMapsApiで領域内の判定を行う


Google Maps JavaScript APIによると対象の地点(緯度経度)が範囲内にあるかどうかの判定には、

google.maps.geometry.poly.containsLocation()

を使うようです。
試しに下記のようなプログラムを書いてみました。

var mapObj;
var moveCount = 0;
var timerId =0;
var marker;
var polygonObj;
var moveArray = [
    {lat:35.397207, lng:132.690478},
    {lat:35.397163, lng:132.688975},
    {lat:35.397163, lng:132.687677},
    {lat:35.396629, lng:132.686883},
    {lat:35.396865, lng:132.686282},
    {lat:35.397477, lng:132.685788},
    {lat:35.398658, lng:132.684694},
    {lat:35.399515, lng:132.683310},
    {lat:35.399786, lng:132.681819},
    {lat:35.399515, lng:132.683310},
    {lat:35.398658, lng:132.684694},
    {lat:35.397477, lng:132.685788},
    {lat:35.396865, lng:132.686282},
    {lat:35.396629, lng:132.686883},
    {lat:35.397163, lng:132.687677},
    {lat:35.397163, lng:132.688975}
];

var polArray = [
    {lat:35.40075201526372,lng:132.68383741378784},
    {lat:35.40075201526372,lng:132.6843523979187},
    {lat:35.40077825113218,lng:132.68459916114807},
    {lat:35.40202881762653,lng:132.68478155136108},
    {lat:35.40274591693491,lng:132.68407344818115},
    {lat:35.40306073900656,lng:132.68443822860718},
    {lat:35.40276340708227,lng:132.68583297729492},
    {lat:35.40215124966733,lng:132.68619775772095},
    {lat:35.401224259589966,lng:132.68641233444214},
    {lat:35.40045467482432,lng:132.68664836883545},
    {lat:35.400122351859025,lng:132.68690586090088},
    {lat:35.39958013776435,lng:132.68699169158936},
    {lat:35.39830329662138,lng:132.68699169158936},
    {lat:35.397603649063456,lng:132.6874852180481},
    {lat:35.39727131434667,lng:132.68791437149048},
    {lat:35.39702643525779,lng:132.68791437149048},
    {lat:35.39689087687094,lng:132.68760859966278},
    {lat:35.39679904686649,lng:132.6873940229416},
    {lat:35.396562912089124,lng:132.68713653087616},
    {lat:35.39630928507647,lng:132.68653571605682},
    {lat:35.39630928507647,lng:132.6861011981964},
    {lat:35.396755318256204,lng:132.6857042312622},
    {lat:35.39730629701294,lng:132.68560767173767},
    {lat:35.39773483344302,lng:132.68531799316406},
    {lat:35.39814150366324,lng:132.68498539924622},
    {lat:35.39867060915896,lng:132.6845347881317},
    {lat:35.39905541097496,lng:132.68401980400085},
    {lat:35.39953641066234,lng:132.68302202224731},
    {lat:35.400349730878,lng:132.68346190452576}
];
function initialize(){
    var latlng = new google.maps.LatLng(35.395897, 132.686527);
    var options = {
        zoom: 15,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    //マップの取得
    mapObj = new google.maps.Map(document.getElementById("map_canvas"),options);
    addPolygon();
   //マーカーセット
    addMarker(moveArray[0]);

}
//マップへポリゴンの追加
function addPolygon(){
    polygonObj = new google.maps.Polygon({
        paths: polArray,
        strokeColor: "#FF0000",
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: "#FF0000",
        fillOpacity: 0.35,
        map: mapObj
    });
}

function onStart(){
    timerId = setInterval(Timer,1500);

    document.getElementById("start").disabled=true;
    document.getElementById("stop").disabled=false;
}

function Timer(){
    moveCount++;
    if(moveCount > 15){
        moveCount = 0;
    }
    //マップからマーカー削除
    marker.setMap(null);
    //マーカーセット
    addMarker(moveArray[moveCount]);
}

function onStop(){
    clearInterval(timerId);
    moveCount = 0;
    //マップからマーカー削除
    marker.setMap(null);
    //マーカーセット
    addMarker(moveArray[0]);
    document.getElementById("start").disabled=false;
    document.getElementById("stop").disabled=true;
}
function addMarker(pos){
    var latlng = new google.maps.LatLng(pos.lat,pos.lng);
    var res = google.maps.geometry.poly.containsLocation(latlng, polygonObj);
    var msg = "";
    if(res){
        msg = "現在、指定された範囲内に入っています。"
    }else{
        msg = "現在は範囲外にいます。"
    }
    document.getElementById("res").innerText = msg;
    marker = new google.maps.Marker({
        position: pos,
        map:mapObj,
    });

}

実行(スタートを押すと)すると、ポリゴンで囲まれた範囲内にマーカーが移動してくるとメッセージが変わるようになっています。

スポンサード・リンク

日本で一番簡単にビットコインが買える取引所 coincheck bitcoin