映射没有集中到PHP中第一次加载时标记的位置

时间:2018-03-15 12:15:37

标签: javascript google-maps-api-3

我有一个对话框,其中包含用于选择地图的输入字段。我已经设置了默认的纬度和经度值,并且地图中也有标记。我已经为Abudhabi.But提供了默认位置。第一次,它显示了印度地区。 我使用了以下代码。

 <script>
    var directionsDisplay,
    directionsService,
    map,chicago;

    if(!window.google||!window.google.maps){  
      var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'https://maps.googleapis.com/maps/api/js?v=3&key=MYKEY&region=AE&' +
            'callback=initialize';
        document.body.appendChild(script);
    }
    else{ 
      initialize();
    }


    function initialize() { //
        var directionsService = new google.maps.DirectionsService(); 
            directionsDisplay = new google.maps.DirectionsRenderer();
            chicago = new google.maps.LatLng(24.2991738,54.69727739999996);
          if(($("#latitude_val").val().length >3) || ($("#longitude_val").val().length>3))
          {
           chicago =  new google.maps.LatLng($("#latitude_val").val(), $("#longitude_val").val());  
      }
      else
      { 
          codeAddress(function(num) {
      //console.log('{{{{}}}}'+num);

          }); 
      }  
      var mapOptions = { zoom:4, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago }
      map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);  
      var marker=new google.maps.Marker({
      position:chicago,
      map:map,
      draggable:true,
      animation: google.maps.Animation.DROP
      });

      marker.setMap(map);

      google.maps.event.addListener(
                marker,
                'drag',
                function() {
                    document.getElementById('latitude_val').value = marker.position.lat();
                    document.getElementById('longitude_val').value = marker.position.lng();
                }

            ); 
            google.maps.event.addListener(map, 'click', function(event) {
          placeMarker(event.latLng,marker);
        });
      //directionsDisplay.setMap(map);
    }

    function fail(){
         alert('navigator.geolocation failed, may not be supported'); 
      }

      function placeMarker(location,marker) {
          if ( marker ) {
            marker.setPosition(location);
          } else {
            marker = new google.maps.Marker({
              position: location,
              map: map
            });
          }
          document.getElementById('latitude_val').value = marker.position.lat();
          document.getElementById('longitude_val').value = marker.position.lng();
    } 

    function codeAddress(callback) {   

      var address = document.getElementById('schoolcity').value;
      if(address.length>3)
      {
          geocoder = new google.maps.Geocoder();
          geocoder.geocode( { 'address': address}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
            chicago = [results[0].geometry.location.lat(),results[0].geometry.location.lng()];
            callback(chicago);
          } else {
              console.log('Geocode was not successful for the following reason: ' + status);  
              chicago = new google.maps.LatLng(51.508742,-0.120850);
            }
          }); 
      }
      else
      {
          chicago = new google.maps.LatLng(51.508742,-0.120850);
      } 
    }
 </script>

当我们在此之后打开对话框时,地图会集中到标记位置。 我需要集中指针在第一次加载对话框时放置的地图。

First image when I load the page .It has markers,but I need to scroll

1 个答案:

答案 0 :(得分:0)

当我修改从https://maps.googleapis.com/maps/api/js?v=3&key=MYKEY&region=AE&callback=initializehttps://maps.googleapis.com/maps/api/js?key=MYKEY&region=AE&callback=initialize的网址时,它对我有用。我已从网址

中删除了version参数