Javascript Google map api V3の中心に位置するfitbound

Question

私はすべてのユーザーの所在地の押しピンに目に見えるように押しボタンを収めたいと考えています。私はそれがユーザーの場所を中心に次のコードを書いたが、いくつかの押しピンは地図から外れますか？

FYI：userPinLocはすでに、私はあなたからuserPinLocを取得している場所がわからないんだけど

function setInitialZoom() { 
      mapZoom = googleMap.getZoom(); 
      var bounds = new google.maps.LatLngBounds(); 
      bounds.extend(userPinLoc); 
      for (i in nearestEntitiesToZoom) { 
       entity = nearestEntitiesToZoom[i]; 
       var googleLatLng = new google.maps.LatLng(entity.latitude,entity.longitude); 
       bounds.extend(googleLatLng); 
      } 

      google.maps.event.addDomListener(googleMap, 'bounds_changed', function() { 
       googleMap.setCenter(userPinLoc); 
      }); 
       googleMap.fitBounds(bounds); 
     } 

Answer 1

私は私はここで、速度・ビューを使用していますJavaとJavaScript

public static void calculateMapFitBounds(GeoLocation userLocation, List<GeoLocation> contents, Map<String, GeoLocation> latlngBounds){ 

    if (Util.isEmtpyGeoLocation(userLocation) || contents == null || contents.isEmpty()) { 
     return; 
    } 

    //SW 
    double minLat = userLocation.getLatitude(); 
    double minLng = userLocation.getLongitude(); 

    //NE 
    double maxLat = userLocation.getLatitude(); 
    double maxLng = userLocation.getLongitude(); 

    for(GeoLocation content: contents){ 

     /* 
     * Populating Top left cordinate (SW) 
     */ 
     minLat = Math.min(minLat, content.getLatitude()); 
     minLng = Math.min(minLng, content.getLongitude()); 

     /* 
     * Populating Bottom right cordinate (NE) 
     */ 
     maxLng = Math.max(maxLng, content.getLongitude()) ; 
     maxLat = Math.max(maxLat, content.getLatitude()); 
    } 

    /* 
    * Calculating Delta fit bounds 
    */ 

    double latDelta = Math.max(Math.abs(userLocation.getLatitude() - minLat), Math.abs(maxLat-userLocation.getLatitude())); 

    double lngDelta = Math.max(Math.abs(userLocation.getLongitude() - maxLng), Math.abs(minLng - userLocation.getLongitude())); 

    //Calculating SW 
    minLat = userLocation.getLatitude() - latDelta; 
    minLng = userLocation.getLongitude()- lngDelta; 


    latlngBounds.put("swLatLng", new GeoLocation(minLat, minLng)); 


    //Calculating NE 
    maxLat = userLocation.getLatitude() + latDelta; 
    maxLng = userLocation.getLongitude()+ lngDelta; 

    latlngBounds.put("neLatLng", new GeoLocation(maxLat, maxLng)); 

} 

を使用してそれをやった速度とjsのコードは

#if($swLatLng && $neLatLng) 
     var swLatLn = new google.maps.LatLng($!swLatLng.latitude, $!swLatLng.longitude, false); 
     var neLatLn = new google.maps.LatLng($neLatLng.latitude, $neLatLng.longitude, false); 

     var bounds = new google.maps.LatLngBounds(swLatLn, neLatLn); 
     googleMap.fitBounds(bounds); 

     #end 

ある

Answer 2

を移入されるプッシュピンオブジェクトです。これをやってみる：

... 
var bounds = new google.maps.LatLngBounds(); 

// Go through each... 
for (i in nearestEntitiesToZoom) { 
    entity = nearestEntitiesToZoom[i]; 
    var googleLatLng = new google.maps.LatLng(entity.latitude, entity.longitude); 
    bounds.extend(googleLatLng); 
}; 

// Fit these bounds to the map 
googleMap.fitBounds(bounds); 
... 

はfitCenterまたはfitBoundsがパラメータとしてLatLngオブジェクトが必要、覚えておいてください。

このコードは、から構成されている：私はこの前にやったときhttp://you.arenot.me/2010/06/29/google-maps-api-v3-0-multiple-markers-multiple-infowindows/

Answer 3

、私は非常に最後の一つとして、マップ中央ではなく、最初の1のために）（bounds.extendをやりました。何らかの理由でよりうまくいくように見えました。

function initialize() { 
    var points = [ 
     { 
      lat: 51.498725, 
      lng: -0.17312 
     }, 
     { 
      lat: 51.4754091676, 
      lng: -0.186810493469 
     }, 
     { 
      lat: 51.4996066187, 
      lng: -0.113682746887 
     }, 
     { 
      lat: 51.51531272, 
      lng: -0.176296234131 
     } 
    ]; 

    var centerLatLng = {lat: 51.532315, lng: -0.1544}; 

    var map = new google.maps.Map(document.getElementById("map"), { 
     zoom:    15, 
     center:    centerLatLng, 
     mapTypeId:   google.maps.MapTypeId.ROADMAP 
    }); 

    var bounds = new google.maps.LatLngBounds(); 

    var homeMarker = new google.maps.Marker({ 
     position: centerLatLng, 
     map: map, 
     icon: "http://maps.google.com/mapfiles/ms/micons/green-dot.png" 
    }); 

    for (var i = 0; i < points.length; i++) {  
     var marker = new google.maps.Marker({ 
      position: points[i], 
      map: map 
     }); 

     bounds.extend(points[i]); 
    } 

    bounds.extend(centerLatLng); 

    map.fitBounds(bounds); 
}