leaflet-gm animation disabled: wheel around center

by Leo

HTML

<script src="https://maps.google.com/maps/api/js?key=AIzaSyBDvnikgZ00aQKEB0wXD1TQCgX6610wuzk"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.4.0/leaflet.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.4.0/leaflet.css">
<script src="//cdn.jsdelivr.net/npm/[email protected]/Leaflet.GoogleMutant.js"></script>
<script src="//api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.js"></script>
<link rel="stylesheet" href="//api.tiles.mapbox.com/mapbox-gl-js/v0.52.0/mapbox-gl.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
<body>
  <div id="googleMap" class="customMap"></div>
  <div id="mapboxMap" class="customMap" style="z-index: 1000;"></div>
</body>

CSS

.customMap {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}

JavaScript

var initialZoom = 7;
var mapopts = {zoomAnimation: false};
//=================================================================================
var lmap = L.map('googleMap', mapopts).setView([37.753574, -122.447303], initialZoom);
var roadMutant = L.gridLayer.googleMutant({  type: 'roadmap' }).addTo(lmap);
//==============================================================================
mapboxgl.accessToken = 'pk.eyJ1IjoiZ29sZW9uIiwiYSI6ImNqanF6cXJtdThlMnEzcHAxcnAweGEzMXUifQ.2QzQdMMMMkS0Td1eMnU5_g';
var mmap = new mapboxgl.Map({
  zoom: initialZoom - 1,
  center: [-122.447303, 37.753574],
  container: 'mapboxMap',
  style: {
    version: 8,
    sources: {
      d25uarhxywzl1j: {
        type: "vector",
        tiles: ["https://d25uarhxywzl1j.cloudfront.net/v0.1/{z}/{x}/{y}.mvt"],
        tileSize: 512
      }
    },
    layers: [{
      id: "mapillary",
      type: "line",
      source: "d25uarhxywzl1j",
      "source-layer": "mapillary-sequences",
      layout: {
        "line-cap": "round",
        "line-join": "round"
      },
      paint: {
        "line-opacity": 0.6,
        "line-color": "rgb(53, 175, 109)",
        "line-width": 2
      }
    }]
  }
});
//=================================================================================
mmap.scrollZoom.disable();
mmap.on("wheel", _.debounce((event) => {
  var wheelDelta = event.originalEvent.wheelDelta;
  let zoomDelta = Math.sign(wheelDelta);
  if (!zoomDelta) {
    return;
  }
  this.mmap.setZoom(this.mmap.getZoom() + zoomDelta)
}, 0));

mmap.on("render", (event) => {
  var center = mmap.getCenter();
  let zoom = mmap.getZoom() + 1;
  lmap.setView(new L.LatLng(center.lat, center.lng), zoom, {
   /*  animate: false,
    noMoveStart: true,
    duration: 1, */
  });
});
//===================================================================================