Карты Google корректно работают в браузере, но не в приложении для Android.

Question

У меня есть приложение для телефонных разговоров, в котором я пытаюсь интегрировать карты Google для показа.

Я переключаясь через visibilty из дивы со следующим сценарием (я также добавил здесь карту сценарий поэтому он будет инициализировать, когда DIV будет показано ниже):

function showMe(elem) { 
     $$('.toggle').each(function(toggle) { 
     if (toggle.id == $(elem).id){ 
      toggle.show(); 
      if (toggle.id == $(contact).id) { 
        jQuery('#contact').css('visibility', 'visible'); 
        var minZoomLevel = 14; 

        var map = new google.maps.Map(document.getElementById('map_canvas'), { 
         zoom: minZoomLevel, 
         center: new google.maps.LatLng(44.444512, 26.09725), 
         mapTypeId: google.maps.MapTypeId.ROADMAP 
        }); 
       }       
      else jQuery('#contact').css('visibility', 'hidden'); 
      } 
     else 
      toggle.hide(); 

     }); 
    } 

У меня есть четыре дивы с coresponding идентификатор и нижние колонтитулы, откуда я переключать отображение дивы с:

onclick="showMe('div ID');" 

на «контакт» ДИВ, где я пытаюсь показать карту я следующий

<div data-role="content" class="toggle" rel="external" id="contact" style="display:block; visibility:hidden;"> 
      <div class="content_holder">      
       <div id="map_canvas" style="height:380px; width:auto; margin-left:15px; margin-right:15px;"></div> 
      </div> 
     </div> 

Когда я загружаю его в свой браузер, он работает по-разному, но на моем мобильном устройстве он показывает только серое пятно в div, куда должна загружаться карта.

В моей config.xml я добавил:

<access origin="http://google.com/" /> 

и в index.html я использую следующий источник сценария, который для карт API V3:

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false" /> 

я упускаю что нибудь?

Answer 1

Я знаю эту проблему, это происходит, когда карта Google нарисовала в элемент без ширины и высоты или в элемент, который установлен для отображения: none проблема возникает, когда вы переключаете ее на отображение: блок или дать его ширина и высота

Так что ваши варианты могут быть

чтобы переписать ваш тумблер скрыть каждую итерацию, чтобы нечто, что переключает visibilty-состояние

и это будет работать, но это может нарушить ваш макет, поэтому ваш лучший вариант, я думаю, это инициировать Карта Google не готова к документу, но в тот момент, когда вы переключаете элемент-контейнер-элемент для отображения()

В любом случае, в момент, когда вы инициируете карту Google, элемент упаковки, который не должен отображаться, не будет отображаться: none

Последний вопрос

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Смежные вопросы

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.