1

InfoWindow domready イベント ハンドラを使用して、InfoWindow のルック アンド フィールを変更しています。

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

jquery を使用して、InfoWindow の内部 div の一部の高さを変更しています。

問題は、高さが変更され、すぐにデフォルトのサイズにリセットされることです。また、イベント ハンドラが 2 回呼び出されます。

すべての 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("...");

InfoWindow が完全に描画された後に変更できる domready 以外に使用できるイベントはありますか?

4

1 に答える 1

0

解決策を見つけました... InfoWindow がマップに追加されるたびに、すべてのタイルが再描画され、それと共にすべての InfoWindow マーカーもリセットされます。

だから、私は

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

変更は保持されますが、別の問題に遭遇しました。

これは、ドラッグ、ズームなど、マップ上で何かが発生するたびに呼び出されます。マーカーごとにフラグを保持し、マーカーが読み込まれている場合にのみこれを実行する必要があります。

2 つのイベントが同時に発生するのを待つ方法はありますか?

アップデート：

domreadyイベントを取得したときにフラグを設定しています。次の を取得したらtilesloaded、フラグを確認し、InfoWindow のサイズを変更します。それは働いています。しかし、再び問題。

同じ座標にもう 1 つマーカーを追加すると、タイルが再読み込みされず、tilesloadedイベントが生成されません。

もう 1 つ質問があります。マップ内のすべてのイベントを 1 つのハンドラーに入れることはできますか?

更新 2

問題が見つかりました。実際の InfoWindow コンテンツの 3 番目の親である div は、サイズがリセットされる唯一の要素です。

そのため、 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',
        });
    }
});
于 2012-12-19T06:53:00.277 に答える