Question

我正在使用InfoWindow domready事件处理程序来修改InfoWindow的外观。

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

我正在使用jquery更改InfoWindow的一些内部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之外是否还有其他事件，这可以让我在完全绘制后修改InfoWindow？

Answer 1

我找到了出路......发生的事情是，只要将InfoWindow添加到地图中，所有的图块都会重新绘制，并且所有的InfoWindow标记也会被重置。

所以，我尝试了

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

它保留了我的变化，但我遇到了另一个问题。

只要地图上发生任何事情，如拖动，缩放等，都会调用此方法。我必须为每个标记保留标记，并且只有在加载标记时才执行此操作。

有没有等待两个事件一起发生？

<强>更新

当我收到domready事件时，我正在设置一个标记。当我得到下一个tilesloaded时，我会检查标志并调整InfoWindow的大小。这是工作。但又是一个问题。

如果我在同一坐标处添加一个标记，则不会重新加载切片并且不会生成tilesloaded事件。

还有一个问题，我可以将地图中的所有事件都放到一个处理程序中吗？

更新2

我发现了这个问题。 div是实际InfoWindow内容的第三个父级，是唯一重置大小的元素。

所以，当我得到tilesloaded事件时，我正在检查div的高度，如果已经重置，那么我再次设置高度......

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',
        });
    }
});

自定义Google Maps API InfoWindow无效

1 个答案: