-1

Preciso adicionar o evento dragend para pegar o centro do mapa

google.maps.event.addListener(map, 'dragend', function(evt) {
        console.log(map.getCenter());
});

porem nao sei como fazer essa adição, segue abaixo o codigo completo que utilizo para criar o mapa:

import React, { useEffect, useRef, useState } from 'react';

export default function Map({ options, onMount, className, onMountProps }) {
  const ref = useRef();
  const [map, setMap] = useState();

  useEffect(() => {
    function onLoad() {
      if (window.google) {
        setMap(new window.google.maps.Map(ref.current, options));
      }
    }

    onLoad();
  }, [options]);

  if (map && typeof onMount === `function`) onMount(map, onMountProps);

  return (
    <div
      style={{
        height: `400px`,
        margin: `0`,
        borderRadius: `4px`,
        border: `1px solid #ccc`,
      }}
      {...{ ref, className }}
    />
  );
}

Map.defaultProps = {
  options: {
    zoom: 10,
    minZoom: 10,
    maxZoom: 10,
    mapTypeControl: false,
    streetViewControl: false,
    rotateControl: false,
    fullscreenControl: false,
    zoomControl: false,
    center: { lat: 48, lng: 8 },
  },
};

1 Resposta 1

0

O seguinte código do seu exemplo cria uma instância de mapa

var map = new window.google.maps.Map(ref.current, options)
setMap(map)
...

Referencie o objeto criado por esse chamada, e o passe no parâmetro map.

google.maps.event.addListener(map, 'dragend', function(evt) {
        console.log(map.getCenter());
});
2
  • Eu tentei ref.google.maps.event.addListener... Mas retorna que não existe o parâmetro google Commented 7/05/2020 às 23:30
  • vou editar o exemplo
    – wkrueger
    Commented 8/05/2020 às 19:28

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .