情報googleマップの方向と星の評価のあるウィンドウ

Question

私はマーカーにinfoWindowを追加しようとしています。マーカーは地図の左側になければなりません。

<script> 
     function initMap() { 
     var uluru = {lat:<?= $location['lat'];?>, lng: <?= $location['lng'];?>}; 
     var map = new google.maps.Map(document.getElementById('gmap_canvas'), { 
      zoom: 14, 
      center: uluru 
     }); 

     var contentString = '<div id="content">'+ 
      '<div id="siteNotice">'+ 
      '</div>'+ 
      '<h4 id="firstHeading" class="firstHeading">Venue</h4>'+ 
      '<div id="bodyContent">'+ 
      '<p><a><?= $location['address'];?></a></p>'+ 
      '</div>'+ 
      '</div>'; 

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

     var marker = new google.maps.Marker({ 
      position: uluru, 
      map: map 
     }); 
     marker.addListener('click', function() { 
      infowindow.open(map, marker); 
     }); 
     } 
    </script> 

Answer 1

あなたが添付された画像は、埋め込みAPIではなく、JavaScriptのAPIからです。私はこのようなグーグルマップは画像

グーグルマップの現在のコードを添付します。表示される画像のように1つのマーカーとインフォウィンドウが必要な場合は、埋め込みAPIがうまくいく場合があります。ここに私たちのマニュアルを参照してください。

https://developers.google.com/maps/documentation/embed/guide

をあなたは正確にあなたが投稿した画像などの埋め込みマップを取得する必要がありますコードは次のようになります。

<iframe 

    width="600" 

    height="450" 

    frameborder="0" style="border:0" 

    src="https://www.google.com/maps/embed/v1/place?key=MY_API_KEY 
&q=Hotel+Sahara+star" allowfullscreen> 
</iframe> 

注：私はのための私のAPIキーを編集されていますセキュリティ。あなたがこのコードにあなた自身を入力すると、あなたのイメージのようなマップが得られます。

代わりにjavaScript APIを使用する場合は、必要なすべてのコンテンツをinfoWindowに入れるコードを追加する必要があります。ただし、埋め込みAPIでは、場所の名前、住所、評価、道順などを自動的に設定できます。