Uso google-map-react y quiero tener el zoom y el centro correctos en el mapa. Para centrar el mapa, uso el centro de accesorios en el componente GoogleMapReact que puedo calcular. Pero para el zoom es más complejo.

Pude ver el uso de fitBounds pero eso no está disponible en "google-map-react"

¿Hay alguna forma de calcular el zoom para que contenga los marcadores que he definido? ¿O una función que lo hace por sí misma como fitbounds?

Tenga cuidado de no confundir " google-map-react " (usado aquí) con "react-google-map" (no usado)

 import GoogleMapReact from "google-map-react"; import {Place} from "@material-ui/icons"; import {useRef} from "react"; const Page = () => { const mapRef = useRef(null); const MarkerPlace = (props) => { return ( <div> <Place fontSize={"large"}></Place> <p>{props.name}</p> </div> ) } const FitBounds = () => { let bounds = new google.maps.LatLngBounds(); let lat = 38.103; let lng = -121.572; bounds.extend(new google.maps.LatLng(lat, lng)); console.log(mapRef.current) //o {props: {…}, context: {…}, refs: {…}, updater: {…}, _getMinZoom: ƒ, …} //The error occurs at the line below mapRef.current.fitBounds(bounds) //TypeError: mapRef.current.fitBounds is not a function //The error occurs at the line above } return ( <div> <GoogleMapReact ref={mapRef} bootstrapURLKeys={{key: ""}} center={defaultCenter} defaultZoom={13} {view === "recherche" && currentSearchData.map((activity, index) => ( <MarkerPlace key={index} lat={activity.latitude} lng={activity.longitude} name={activity.name}/> ))} </GoogleMapReact> <button onclick={FitBounds}>FitBounds</button> </div> ) } export default Page;