2016-10-13 3 views
0

Моя проблема в том, что у меня есть код javascript, который вызывает API-интерфейс google maps и отображается просто отлично, когда я его просматриваю, используя мой браузер на своем рабочем столе, браузер, который я использую это google chrome, но когда я пытаюсь просмотреть его, используя мой Android-телефон, он не отображается полностью, но когда я поворачиваю свой экран, тогда он отлично работает.Google map JavaScript не загружается полностью в мобильном браузере

enter image description here

Когда я поворачиваю мой экран, то он загружает нормально enter image description here

ниже мой код

var markers = new Array(); 
var map ; 
function initialize(locations,firstLat,firstLng,hovericon,zoomLevel) { 
    var locations = locations; 
    map = new google.maps.Map(document.getElementById('map_canvas'), { 
    scrollwheel   : false, 
    zoom     : zoomLevel, 
    center    : new google.maps.LatLng(parseFloat(firstLat), parseFloat(firstLng)), 
    disableDefaultUI  : false, 
    streetViewControl  : false, 
    mapTypeControlOptions : { mapTypeIds: [] }, 
    mapTypeId    : google.maps.MapTypeId.ROADMAP 
    }); 
    map.setOptions({ minZoom: 3, maxZoom: 20 }); 
    var marker, i; 
    map.setOptions({styles: styles}); 
    Object.size = function(obj) { 
    var size = 0, key; 
     for (key in obj) { 
      if (obj.hasOwnProperty(key)) size++; 
     } 
     return size; 
    }; 
    var markerclusterer = null; 
    var mc = new MarkerClusterer(map); 
    for (i = 0; i < Object.size(locations); i++) { 
     marker = new google.maps.Marker({ 
     position  : new google.maps.LatLng(locations[i][1], locations[i][2]), 
     icon   : site_url+'assets/front/images/'+locations[i][4], 
     map   : map, 
     jobID  : locations[i][3], 
     draggable : false, 
     originalicon : site_url+'/assets/front/images/'+locations[i][4], 
     hovericon : site_url+'assets/front/images/'+hovericon, 
     zIndex  : Math.round((locations[i][1], locations[i][2])*-100000)<<5 
     }); 
     google.maps.event.addListener(marker, 'click', function() { 
     //alert(this.jobID); 
     var appElement=document.querySelector('[ng-app=yolomd]'); 
     var $rootscope = angular.element(appElement).scope(); 
     console.log($rootscope); 
     $rootscope.ismarkerClicked=this.jobID; 
     $rootscope.$apply(); 
      // window.location.href = this.jobID; 
     }); 
     google.maps.event.addListener(marker, "mouseover", function() { 
      this.setIcon(this.hovericon); 
     }); 
     google.maps.event.addListener(marker, "mouseout", function() { 
      this.setIcon(this.originalicon); 
     }); 
     markers.push(marker); 
     mc.addMarker(marker); 
     function AutoCenter() 
     { 
     var bounds = new google.maps.LatLngBounds(); 
      $.each(markers, function (index, marker) { 
      bounds.extend(marker.position); 
      }); 
     map.fitBounds(bounds); 
     } 

    if(zoomLevel==10){ 
     AutoCenter(); 
     } 
     google.maps.event.trigger(map, "resize"); 
    } 
} 

ответ

2

Если вы используете Android устройство, Google Chrome имеет возможность подключения к устройству и использование инструментов разработчика для него. Практически вы получите консоль Chrome для устройства.

https://developers.google.com/web/tools/chrome-devtools/remote-debugging/

Таким образом, вы можете увидеть брошенные ошибки, если есть что-то не так с яваскрипта функций или изменения параметров на ходу.

Надеюсь, это поможет.

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