Чтобы отключить масштабирование в React Leaflet, вы можете рассмотреть следующие методы:

1. Использование свойства zoomControl: вы можете установить для свойства zoomControlкомпонента MapContainerзначение falseчтобы отключить кнопки управления масштабированием по умолчанию. Вот пример:

import { MapContainer, TileLayer } from 'react-leaflet';
function Map() {
  return (
    <MapContainer zoomControl={false}>
      <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
    </MapContainer>
  );
}

2. Использование CSS. Вы можете отключить масштабирование, применив стили CSS к элементу контейнера карты. Установите для свойства pointer-eventsзначение none, чтобы отключить все события мыши, включая масштабирование. Вот пример:

import { MapContainer, TileLayer } from 'react-leaflet';
function Map() {
  return (
    <MapContainer style={{ pointerEvents: 'none' }}>
      <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
    </MapContainer>
  );
}

3. Использование параметров Leaflet: React Leaflet позволяет передавать параметры Leaflet непосредственно компоненту карты. Вы можете использовать опцию zoomControl, чтобы отключить кнопки управления масштабированием. Вот пример:

import { MapContainer, TileLayer } from 'react-leaflet';
function Map() {
  const mapOptions = {
    zoomControl: false,
  };
  return (
    <MapContainer {...mapOptions}>
      <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
    </MapContainer>
  );
}