Карты Google - 2 карты на одной странице не работают

Question

Мне нужно иметь две карты Google на той же странице.

Однако по какой-либо причине отображается только первая карта.

Я пробовал this тему без каких-либо успехов, так как проблема не устранена.

Мой код теперь выглядит как этот

function initialize() { 
      var myLatlng = new google.maps.LatLng(41.560655,-8.386545); 
      var myLatlng2 = new google.maps.LatLng(41.560655,-8.386545); 
      var mapOptions = { 
       zoom: 5, 
       center: myLatlng, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var mapOptions2 = { 
       zoom: 8, 
       center: myLatlng2, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
      var map2 = new google.maps.Map(document.getElementById('room-canvas'), mapOptions2); 

} 

И в HTML

   <div class="g_12"> 
       <div class="widget_header"> 
        <h4 class="widget_header_title wwIcon i_16_valid">Distribuição Utilizadores</h4> 
       </div> 
       <div class="widget_contents noPadding" style="height:450px;"> 
        <div id="map-canvas"></div> 


       </div> 
      </div> 

      <div class="g_12"> 
       <div class="widget_header"> 
        <h4 class="widget_header_title wwIcon i_16_valid">Distribuição Salas</h4> 
       </div> 
       <div class="widget_contents noPadding" style="height:450px;"> 
        <div id="room-canvas"></div> 


       </div> 
      </div> 

Answer 1

если карты DIVs изначально невидим, вы должны применить стиль высоты прямо на этом DIVs.

Если это не так, пожалуйста, предоставьте консольный журнал из 2 объектов карты