Изменение центрирования карты при нажатии на placemark

Micheille commented 3 years ago

Здравствуйте! Есть ли способ динамически центрировать карту по нажатому placemark'у? Попытки использовать state и defaultState и изменять объекты для них не увенчались успехом

mmarkelov commented 3 years ago

@Micheille привет. Предложил бы такой вариант:

import { YMaps, Map, Placemark } from "react-yandex-maps";
import { useRef } from "react";

export default function App() {
  const map = useRef(null);
  const mapState = {
    center: [55.779625, 37.5012],
    zoom: 9
  };

  const handleClick = (e) => {
    const placemarkCoords = e.get("coords");
    if (map.current) {
      map.current.setCenter(placemarkCoords);
    }
  };

  return (
    <div className="App">
      <YMaps>
        <Map state={mapState} instanceRef={map}>
          <Placemark onClick={handleClick} geometry={[55.684758, 37.738521]} />
        </Map>
      </YMaps>
    </div>
  );
}

Micheille commented 3 years ago

Спасибо большое, помогло! Единственное, в моем случае мне пришлось изменить stateна defaultState, чтобы карта не возвращалась постоянно к изначальному центру

gribnoysup / react-yandex-maps

Изменение центрирования карты при нажатии на placemark #304