Google maps - keep center when zooming

Question

In Google Maps, I would like to be able to keep the center of the map on a marker on my location when I\'m zooming in or out. It\'s something that Ingress does, it doesn\'t matt

Answer 1

Purely using Javascript

• First you disable scroll zoom function by default of google map by scrollwheel=false,
• Next create custom scroll zoom function by capture mouse event and set zoom level for google map

Check my sample code: Fiddle URL: https://jsfiddle.net/vh3gqop0/17/

var map, i = 12;
function initialize() {
		var myLatlng = new google.maps.LatLng(46.769603, 23.589957);
		var mapOptions = {
			center: myLatlng,
			zoom: i,
			scrollwheel: false,
  		disableDoubleClickZoom: true,
			mapTypeId: google.maps.MapTypeId.ROADMAP
		};
		map = new google.maps.Map(document.getElementById("map_canvas"),
			mapOptions);

		var marker = new google.maps.Marker({
			position: myLatlng,
			map: map,
			title: 'Any Title'
		});


	}

google.maps.event.addDomListener(window, 'load', initialize);

$( document ).ready(function() {
    $('#map_canvas').on("wheel", function(evt){
   // console.log(evt.originalEvent.deltaY);
    		if(evt.originalEvent.deltaY > 0){
        	map.setZoom(++i);
        }else {
        	map.setZoom(--i);
        }
    		
    });
});

#map_canvas{
    height:400px;
    width:100%;
}