Estoy usando un folleto en una aplicación React js (con mecanografiado).

El mapa funciona bien en los navegadores de escritorio, pero en los dispositivos móviles tengo algunos problemas al hacer zoom y desplazarme mientras pellizco la pantalla: mientras pellizco la pantalla, los marcadores se mueven juntos con los dedos, pero el mapa no sigue de inmediato, tiene algunos tipo de animación que hace que se desincronice con los marcadores durante el tiempo de animación.

Lo que esperaría es que el mapa siga correctamente los marcadores incluso mientras se mueven o que los marcadores sigan la animación del mapa. De alguna manera no puedo encontrar ninguna opción para controlar este comportamiento.

Este es mi código de reacción para el mapa:

 <MapContainer id="map" center={[41.890196167312055, 12.492341923687258]} ref={mapRef} trackResize={true} zoomSnap={0} zoomDelta={0.3} zoomControl={false} zoom={zoom} maxZoom={18} minZoom={2} inertia={false} easeLinearity={0}> <TileLayer attribution='&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" /> <ZoomControl position="bottomleft" /> <ScaleControl position="bottomleft" metric imperial={false} /> { Object.keys(places).map(place => <Marker key={place} position={[plantsPlaces[place][0].lat!, places[place][0].lng!]}> <Popup offset={L.point(0,-20)} zoomAnimation={false} > {(places[place]).map(p => <div key={p.id}> <div className="mapTooltipHeader flex flex-row align-items-center justify-content-between">{p.plantName}</div></div>)} </Popup> </Marker>) } </MapContainer>

El efecto se puede ver aquí: https://gifyu.com/image/SKXsL

¿Es posible deshabilitar este comportamiento y simplemente hacer que el mapa siga los marcadores mientras pellizca?