2012-12-19 79 views
1

我使用InfoWindow domready事件處理程序來修改InfoWindow的外觀。自定義Google Maps API InfoWindow不工作

google.maps.event.addListener(popup, 'domready', function() { 

我改變了一些使用jQuery的信息窗口內的div的高度。

問題是高度變化,並立即重置回默認大小。此外,事件處理程序被調用兩次。

並非所有的div都重置它們的大小,只有一些做。我的代碼

部分:

popup = new google.maps.InfoWindow({ 
    content:'<image id="pin_' + pin_count + '" src="question.png"/>' 
}); 

// Parent.Parent.Parent 
e = $('#pin_' + pin_count).parent().parent().parent(); 
console.log(e.height()); 
h = parseFloat(e.height()); 
e.css({ 
    'position' : 'absolute', 
    'top' : '-100px', 
    'height' : (h + 100) + 'px', 
    'border-radius' : '16px 16px 16px 16px', 
    'border' : '2px solid red', 
}); 
console.log(e.height()); 
console.log("..."); 

難道還有比domready中,我可以使用,這讓我可以修改信息窗口後,它完全繪製以外的任何其他活動。

回答

0

我一條生路......發生什麼事是當一個信息窗口添加到地圖中,所有的瓦片重新繪製和與它一起的所有信息窗口標記過復位。

於是,我試着用

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

它使我的變化,但我遇到一個不同的問題來了。

一旦有事情發生在地圖上,像拖拽,縮放等,我將不得不守旗每個標記和執行這只是如果正在加載的標記這將被調用。

反正是有等待兩個事件一起發生的呢?

更新:

我設置標誌時,我得到domready事件。當我得到下一個tilesloaded時,我檢查標誌並調整我的InfoWindow。這是工作。但是又是一個問題。

如果我在同一座標增加一個標記,瓷磚,不會重新加載,並且不會產生tilesloaded事件。

還有一個問題,我可以將地圖中的所有事件都變成單個處理程序嗎?

更新2

我發現這個問題。作爲實際InfoWindow內容的第三個父級的div是大小被重置的唯一元素。

所以,我檢查div的高度,當我得到tilesloaded情況下,如果它已經被重置,然後我再設置高度...

google.maps.event.addListener(map, 'tilesloaded', function() { 
    e = $('#pin_' + pin_count).parent().parent().parent(); 
    // default height is saved before the div is resized in domready event handler 
    if (e.css("height") < default_height) { 
     h = parseFloat(e.height()); 
     e.css({ 
      'height' : (h + 100) + 'px', 
     }); 
    } 
});