How to zoom to google maps area?

Question

JavaScript

Please help to finalize the script, there are several labels, you need to zoom to the area on click.
Now it zooms to the last label, I can’t do it correctly in the loop so that when you click on the label, it zooms to it, and not to the last one

<script>
      var map;
      function initMap() {
        map = new google.maps.Map(
            document.getElementById('map'),
            {center: new google.maps.LatLng(11.397, 30.644), zoom: 3});



        var iconBase =
            'http://web-dnepr.ru/earth/img/';

        var icons = {
          info: {
            icon: iconBase + 'map-marker.svg'
          }
        };

        var features = [
          {
            position: new google.maps.LatLng(18.425498298, -64.620497518),
            type: 'info'
          }, {
            position: new google.maps.LatLng(19.333332, -81.2166658),
            type: 'info'
          }, {
            position: new google.maps.LatLng(46.204391, 6.143158),
            type: 'info'
          }, {
            position: new google.maps.LatLng(48.864716, 2.349014),
            type: 'info'
          }, {
            position: new google.maps.LatLng(25.276987, 55.296249),
            type: 'info'
          }, {
            position: new google.maps.LatLng(55.751244, 37.618423),
            type: 'info'
          }, {
            position: new google.maps.LatLng(50.45466, 30.5238),
            type: 'info'
          }, {
            position: new google.maps.LatLng(31.963158, 35.930359),
            type: 'info'
          }, {
            position: new google.maps.LatLng(1.290270, 103.851959),
            type: 'info'
          }, {
            position: new google.maps.LatLng(53.350140, -6.266155),
            type: 'info'
          }
        ];

        // Create markers.
        for (var i = 0; i < features.length; i++) {
          var marker = new google.maps.Marker({
            position: features[i].position,
            icon: icons[features[i].type].icon,
            map: map
          });
        };
        map.addListener('center_changed', function() {
          // 3 seconds after the center of the map has changed, pan back to the
          // marker.
          window.setTimeout(function() {
            map.panTo(marker.getPosition());
          }, 3000);
        });

        marker.addListener('click', function() {
          map.setZoom(8);
          map.setCenter(marker.getPosition());
        });
        
      }
    </script>

Answer 1

function onMarkerClick(e) {
  map.setZoom(8);
  map.panTo(e.latLng);
}


for (const f of features) {
  const marker = new google.maps.Marker({
    position: f.position,
    icon: icons[f.type].icon,
    map,
  });
  marker.addListener('click', onMarkerClick);
}