Search code examples
google-maps-api-3locationcenterfitbounds

Javascript Google map api V3 fitbounds with center location


I want to fitbound pushpins to visible all around user's location pushpin. i wrote the following code it center the user location but few pushpin goes out of map ??

FYI: userPinLoc is pushpin object which is already populated

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

Solution

  • I did it using java and 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));
    
    }
    

    I am using velocity views so here is velocity and js code

    #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