web-dev-qa-db-ja.com

Google Map .InfoWindow Set Height and Width

グーグルマップのサイズと幅をどのように設定しますかInfoWindow？ APIページで を調べたところ、maxWidthメソッドしか見つかりませんでした。

編集：私はいくつかのことを試しました。これまでのところ、これらの機能はありません。

    var markerInfoWindow = new google.maps.InfoWindow({
        content: markerHTMLString,
        maxHeight: 400,  //Doesn't work
        maxWidth: 400,   //Doesn't work
        width: 300,      //Doesn't work
        height: 300      //Doesn't work
    });

また、markerHTMLStringはこれに等しいと言います。

<div class = "MarkerPopUp"><div class = "MarkerContext">Text</div></div>

私はこれらの3つのオプションも試しました（どれも機能しませんでした）

  1. .MarkerPopUp {
    height: 300px;
    width: 300px;
}

  2. .MarkerPopUp {
    height: 300px;
    width: 300px;
}

.MarkerContext {
    height: 300px;
    width: 300px;
}

  3. .MarkerContext {
    height: 300px;
    width: 300px;
}

これも機能しません：

document.getElementById('MarkerPopUp')parentNode.style.overflow = '';

またはこれ

document.getElementById('MarkerPopUp').parentNode.parentNode.style.overflow = '';

私はほとんどすべてのスレッドを調べて、すべてを試しています。いくつかのことを制限するためだけに（別の問題があるかもしれませんが）

javascriptcssgoogle-mapsgoogle-maps-markers
10
Stanley Cup Phil

HtmlがマップAPIに渡されて解析されると、スタイルシートの削除にアクセスできない可能性があります。 MarkerPopUpでインラインスタイルとして幅を追加してみてください。

<div class = "MarkerPopUp" style="width: 300px;"><div class = "MarkerContext">Text</div></div>

私もインラインスタイルが嫌いですが、この場合は問題を解決できる可能性があります。

22
ryanmarc
.gm-style-iw{
    max-height: 10px;
}

Gm-style-iwのスタイルを設定すると機能します。

0
fuiiii

Cssで！importantを使用します

.MarkerPopUp {
    height: 300px !important;
    width: 300px !important;
}
0
Osama AbuSitta

ラッパーを使用できます<div>そしてこのようなスタイルを追加します<div style='height: 40px; text-align: center'>そしてcssコードを追加します.gm-style-iw { max-width: 400px!important;}cssファイル内;

0
erdemildiz