Question

我的问题是，我有一些调用google maps API的javascript代码，当我在桌面上使用浏览器查看它时显示效果很好，我使用的浏览器是Google Chrome，但是当我尝试使用我的Android手机查看它并没有显示完整但是当我旋转我的屏幕然后它工作正常。

当我旋转屏幕时，它会正常加载

下面是我的代码

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");
    }
}

Answer 1

如果您使用Android设备，Google Chrome可以选择连接到该设备并使用开发人员工具。实际上，您将获得该设备的Chrome控制台。

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

通过这种方式，您可以查看抛出的错误，如果javascript函数有问题，或者在运行中更改参数。

我希望这会有所帮助。

Google地图JavaScript未在移动浏览器上完全加载

1 个答案: