Как я могу получить текущий уровень масштабирования карты Leaflet?

Question

Я пытаюсь получить уровень масштабирования карты в реальном времени, чтобы создать кнопку, которая фиксирует масштаб с текущим значением. Я пытался использовать getMapZoom и getZoom, но оба дают мне неопределенное значение. Я думаю, что я не использую правильную ссылку, но я не смог найти много документации об этом. Вот код:

<Map className="map-layer" 
          center={center} 
          onoverlayadd={this.overlayadd} 
          onoverlayremove={this.overlayremove}
          ondragend={this.zoomChange}
          onzoomend={console.log('Zoom: ' + this.mapRef.leafletElement.getMapZoom())}
          zoom={this.state.zoom}
          ref={this.mapRef}
          preferCanvas={false}
          animate={true}
          scrollWheelZoom={this.state.zoomLock ? false : true}
          doubleClickZoom={this.state.zoomLock ? false : true}
          touchZoom={this.state.zoomLock ? false : true}
          maxZoom={7}
          minZoom={7}

                    >

Answer 1

В чистом буклете, если вы определили карту как const map = L.map("map", options), чем просто позвоните map.getZoom().

В конструкторе this.mapRef = React.createRef() В элементе карты:

    ref={this.mapRef}
    onzoomend={() => console.log(this.mapRef.current.leafletElement.getZoom()}