A Leaflet renderer that will reproject vector layers at each step of an animated transition. This renderer is best when you have relatively few features.

leaflet-smoothrender.js

const SmoothRenderer = L.SVG.extend({
  // Override the default _onZoom function, which simply scales the lower
  // resolution shapes. Instead, we want to reproject the shapes at each new
  // zoom level, as is done by default when zooming ends.
  _onZoom: function () {
    this._onZoomEnd();
    this._update();
  }
});

/*

Update the base renderer to L.Canvas insetad of L.SVG as necessary.

Use with the `renderer` option either on `Map` objects or `Path` objects. For
example:

    const map = L.map('map', { renderer: new SmoothRenderer() }).setView([0, 0], 0);

Then, when you add vector data to the map and use animated zooming, your vectors
will be reprojected at each step, instead of scaled from a low-resolution.

    const layer = L.geoJSON(...);
    map.flyTo(layer.getBounds());

*/