2017-01-12 6 views
0

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

карты нагрузки - однако он остается серым. Все остальные элементы управления на карте, похоже, работают (щелчок по логотипу открывает карты google в правом лат/lng + масштабное местоположение, кнопка обслуживания условий работы и т. Д.)

любые идеи, что мне не хватает в моей реализации?

Html:

<div class="tab-pane" id="auctionMap"> 
    <input type="hidden" value="@Model.Lat" id="lat" /> 
    <input type="hidden" value="@Model.Long" id="lng" /> 
    <div id="basic_map" style="width:100%; height:400px;"></div>   
</div> 

JS:

<script> 
    function initMap() { 


     var uluru = { 
     lat: parseFloat(document.getElementById('lat').value), 
     lng: parseFloat(document.getElementById('lng').value), 
     } 

     google.maps.visualRefresh = true; 
     var center = new google.maps.LatLng(parseFloat(document.getElementById('lat').value), parseFloat(document.getElementById('lng').value)); 
     var map = new google.maps.Map(document.getElementById('basic_map'), { 
      zoom: 17, 
      center: center, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
     var marker = new google.maps.Marker({ 
      position: uluru, 
      map: map 
     }); 

    } 
</script> 

<script async defer src="https://maps.googleapis.com/maps/api/js?key=SECRETKEY&callback=initMap"></script> 

** редактировать **

Discovery: бег initMap после страницы закончила загрузку с картой ВИДИМОЙ на экране загружает карту правильно. если карта не видна (выбирается то есть еще одна закладка - это отображение, в частности, на начальной загрузки .tab-control - он остается серой

+0

вы не могли бы разместить исправленный код для этого? – wazzahenry

ответ

1

Пожалуйста, попробуйте это для вашего сценария

  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAPKeBYFqGsbfGiH7wvx1mMH9A4I" 
type="text/javascript"></script> 
+1

Вам не хватает точки: я выполняю асинхронную и отложенную нагрузку на скрипт, чтобы он не блокировал загрузку страницы. Обратный вызов должен вызывать ini tMap() после его завершения. он делает это как минимум ... – Eon

+0

Cocuba

0

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

Discovery: бег initMap после страницы закончила загрузку с карты ВИДИМОЙ на экране загружает карту правильно. если карта не видно (т.е. выбрана другая вкладка - это отображение, в частности, на самозагрузки-контроле TAB-- он остается серой

Просто подключая щелчок слушатель на вкладку, где карта была на и ссылаясь на initMap() отображается карта снова, потому что это время, div, в котором загружена карта видна снова, и у него есть что-то отдавайте. Я заслуживаю мои downvotes здесь.

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