web-dev-qa-db-ja.com

Googleマップはデフォルトで情報ウィンドウを開きますか？

次の例は、場所のGoogleマップ上の単純なマーカー（標準アイコン）を示しており、アイコンをクリックすると情報ウィンドウが開きます。アイコンをクリックして開く必要がないように、デフォルトで開いている情報ウィンドウを表示できますか？

var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
    var myOptions = {
    zoom: 4,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var contentString = '<div id="content">'+
        '<div id="siteNotice">'+
        '</div>'+
        '<h2 id="firstHeading" class="firstHeading">Uluru</h2>'+
        '</div>';

    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title:"Uluru (Ayers Rock)"
    });

    google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
    });
google-mapsgoogle-maps-markers
39
Billa

クリックせずにデフォルトで開いている情報ウィンドウを表示したい場合は、次のような新しいコードを追加してください。

あなたのコード：

_google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map,marker);
});
_

したがって、次のような新しいコードがあります。

_google.maps.event.addListener(marker, 'click', function() {
   infowindow.open(map,marker);
});

infowindow.open(map,marker);
_

ご覧のとおり、infowindow.open(map,marker);を使用して小さな行コードを追加するだけです

76
Idham Perdameian

クリックせずにウィンドウを自動的に開く必要がある場合は、ページの読み込み時に「開く」を直接実行できます。

infowindow.open(map, marker);

ただし、これにより、場合によってはマップが適切に自動パンされず、オーバーレイの上部がマップのエッジから外れたままになることがあります。

私のために働いた方法は、マップ上の「タイルロードされた」イベントのリスナーでそれをラップすることです

google.maps.event.addListenerOnce(map, 'tilesloaded', function() {
  infowindow.open(map, marker);
});
18
Michal Charemza

以下のコードは私のためにうまく機能しています：

緯度、経度、コンテンツ、mapidを変更します（カスタムdiv idを使用）：

<script type="text/javascript">

function initialize() {
    var myLatlng = new google.maps.LatLng(48.206615,13.487928);
    var mapOptions = {
        zoom: 16,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var contentString = '<p><strong>Bahnhofstraße 32</strong></p><p>Bahnhofstraße 32, 4910 Ried im</p><p>Innkreis, Austria</p>';

    var infowindow = new google.maps.InfoWindow({
      content: contentString
  });


    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title: 'Bahnhofstraße 32'
    });

    google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
  });
  // show map, open infoBox 
        google.maps.event.addListenerOnce(map, 'tilesloaded', function() {
          infowindow.open(map, marker);
        });

}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
1
vijay rami

上記のコードは完全に機能します。ただし、情報ウィンドウが完全に表示されるように、マップは移動しませんでした。代わりに、プッシュピンは中央にとどまりました。

それでは、情報ウィンドウが完全に表示されるように、マップをどのように調整しますか？これを読んでください： Google Maps：マーカークリックでの自動中心マップ

プッシュピンをそのままにして、マップを移動しない場合は、これをお読みください： Googleマップ：InfoWindowがマップを移動しないようにする方法

人々が次の一歩を踏み出すのに役立つことを願っています

1
stevepowell2000