如何獲取點擊多邊形的引用？ （谷歌地圖api v3）

Question

我已經設置了一些多邊形，把它們繪製在地圖上就好了。點擊時我也設法觸發console.log。但是，如何確定哪個多邊形實際被點擊？

正如你可以在我的示例代碼中看到的那樣，我將每個對象存儲在集合「lot」中，但是 - 單擊它們只會給我點擊的經緯度。我想我可能需要循環通過我的多邊形，並檢查點被點擊是否相交，從而找出它是哪個多邊形...有沒有更簡單的解決方案？

var lot = new google.maps.Polygon({ 
    paths: me.area, 
    strokeColor: 'black', 
    strokeOpacity: 0.35, 
    strokeWeight: 1, 
    fillColor: fillcol, 
    fillOpacity: 0.35 
}); 

lot.setMap(map); 
var obj = { 
    'id':me.id, 
    'rented':me.rented, 
    'area':lot 
}; 

google.maps.event.addListener(lot, 'click', function(event) { 
    console.log(event); 
}); 

lots.push(lot); 

Answer 1

爲什麼不分配給每個多邊形一些id屬性，當你創建它們，以後只需使用this.myID？實際上，您可以將所需的所有信息都掛在該多邊形對象上。

var lot = new google.maps.Polygon({ 
     paths: me.area, 
     strokeColor: 'black', 
     strokeOpacity: 0.35, 
     strokeWeight: 1, 
     fillColor: fillcol, 
     fillOpacity: 0.35 
    }); 

    lot.setMap(map); 

    var obj = { 
     'id':me.id, 
     'rented':me.rented, 
     'area':lot 
    }; 
    lot.objInfo = obj; 

    google.maps.event.addListener(lot, 'click', function(event) { 
     console.log(this.objInfo); 
    }); 

    lots.push(lot); 

它會比循環中的路徑比較更有效，或者我錯過了什麼？ :)

Answer 2

原來getPath（）就像一個魅力一樣。我沒有意識到我實際上已經獲得了在click事件上傳遞的多邊形引用，爲了將其與我存儲的「lot」進行匹配，我只需循環訪問我的存儲區域，並將this.getPath與other.getPath進行比較，如果匹配，則知道哪個區域是點擊，現在可以顯示與此特定對象相關的信息。

下面是一個代碼示例： （停車的地方是它本身具有含停車場的對象數組我的停車區對象的數組）

google.maps.event.addListener(lot, 'click', function(event) { 

    var myPath = this.getPath(); 

      for(var i = 0; i < parking.length; i++){ 
      for(var j = 0; j < parking[i].lots.length; j++){ 
       var lot = parking[i].lots[j]; 

       var otherPath = lot.poly.getPath(); 

       if(otherPath == myPath){ 
        console.log(lot); 
        break; 
       } 
      } 
      } 

     }); 

Answer 3

如果我能用一種不同的解決方案稍微晚一點，我遇到了同樣的問題，並發現可以在多邊形上定義自定義屬性。

我的例子（其地圖美國的上創建的狀態）

poly = new google.maps.Polygon({ 
    map_state_id: map_state_id, 
    paths: pts, 
    fillColor: colour, 
    fillOpacity: 0.66, 
    strokeWeight: 1, 
    clickable:true 
    }); 

在這種情況下「map_state_id」是自定義屬性。我已經將它定義爲狀態的ID（1表示阿拉巴馬州，2表示阿拉斯加州，等等）

然後，當稍後點擊特定狀態時，可以將此「map_state_id」傳遞到事件函數中。

google.maps.event.addListener(poly, 'click', function() 
    { 
    var map_state_id = this.map_state_id; //retrieve correct state_id 

    $.ajax(
     { 
     type: "POST", 
     url: "http://www...get_state_info.php", 
     data: {state_id : map_state_id}, 
     dataType: "html", 
     success: function(data) 
      { 
      $("#state_info").html(data); //display some info 
      }      
     }); 
    }); 

，我發現這個特定的概念在http://dominoc925.blogspot.com/2011/12/add-your-own-property-field-to-google.html