<script
src="https://maps.googleapis.com/maps/api/js">
</script>

<div id="googleMap"></div>
#googleMap {width:100%;height:380px;}
var myCenter=new google.maps.LatLng(-6.2085841,106.7635933);

function initialize()
{
var mapProp = {
  center: myCenter,
  zoom:16,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  };

var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);

var marker = new google.maps.Marker({
  position: myCenter,
  title:'Click to zoom'
  });

marker.setMap(map);

google.maps.event.addListener(marker,'click',function() {
  map.setZoom(9);
  map.setCenter(marker.getPosition());
  });
     
google.maps.event.addListener(map,'center_changed',function() {

  window.setTimeout(function() {
    map.panTo(marker.getPosition());
  },3000); // 3 detik setelah map digeser akan kembali ke lokasi map utama
  });
}
google.maps.event.addDomListener(window, 'load', initialize);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.