Does not work in Leaflet 1.8.0

[Nazanne]

In Leaflet 1.8.0 the map immediately jumps to a new location each time the map is clicked to create a measurement point. This behavior is easily reproachable by updating the demo to Leaflet 1.8.0. For now I've had to revert to Leaflet 1.7.1.

[agishk]

@Nazanne Did you find some solution on this? As the measure was perfectly working fine with lower version but not with 1.8.0.

[Nazanne]

@agishk I did not find a direct solution. At this point I'm using mapbox.js instead of Leaflet.

[Falke-Design]

The fix would be:

 // get state vars and interface ready for measure
  _startMeasure: function() {
    this._locked = true;
    this._measureVertexes = L.featureGroup().addTo(this._layer);
    this._captureMarker = L.marker(this._map.getCenter(), {
      clickable: true,
      zIndexOffset: this.options.captureZIndex,
      opacity: 0,
      autoPanOnFocus : false
    }).addTo(this._layer);

Workaround:

L.Control.Measure.include({
	// set icon on the capture marker
	_setCaptureMarkerIcon: function () {
		// disable autopan
		this._captureMarker.options.autoPanOnFocus = false;

		// default function
		this._captureMarker.setIcon(
			L.divIcon({
				iconSize: this._map.getSize().multiplyBy(2)
			})
		);
	},
});

var measure = L.control.measure({}).addTo(map);

[ksalamy]

This did it! Thanks Falke-Design!

[karasma3]

i am experiencing the same behaviour but with the leaflet version 1.7.1 and leaflet-measure 3.1.0.
@Falke-Design thanks for the workaround, hope this will be fixed in the newer version

[karasma3]

@bre7 will this be merged soon?

[bre7]

Last commit on Apr 8, 2018 so my guess is...no.
It's just a fork with @Falke-Design's fix.

[abewartech]

export const MeasureControl = createControlComponent((props) => new Control.Measure(props));

L.Control.Measure.include({ _setCaptureMarkerIcon: function () { this._captureMarker.options.autoPanOnFocus = false; this._captureMarker.setIcon( L.divIcon({ iconSize: this._map.getSize().multiplyBy(2), }), ); }, });