Realmente necesito ayuda con esto. Mi proyecto de reacción no funciona tan bien con Google Maps. Probé mis otros proyectos que lo tienen y aún funciona, pero ahora estoy creando uno nuevo que no funciona. Cada vez que miro la consola de Google, las solicitudes no se suman y mi proyecto de reacción todavía está en blanco. También ya configuré en css el ancho a alto del div: 100vh y ancho: 100%
Código de componente
import React, { useState, useEffect } from 'react' import '../css/Home.css'; import { GoogleMap, withScriptjs, withGoogleMap, Marker, InfoWindow } from 'react-google-maps' import Axios from 'axios'; function Map(){ const [coords, setcoords] = useState({ lat: "", lng: "" }); // navigator.geolocation.watchPosition((position) => { // console.log(position); // }) return( <GoogleMap defaultZoom={15} defaultCenter={{ lat: 14.706010, lng: 121.086983 }} > </GoogleMap> ) } const WrappedMap = withScriptjs(withGoogleMap(Map)); function Home() { return ( <div id='div_home'> <WrappedMap googleMapURL={`https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=MY_KEY_I_JUST_REMOVED_IT`} loadingElement={<div style={{height: '100%'}} />} containerElement={<div style={{height: '100%'}} />} mapElement={<div style={{height: '100%'}} />} /> </div> ) } export default HomeHe resuelto mi problema. ¡Resulta que tengo un react y react-dom v.18 algo e instalé la versión 17.0.2 y funcionó totalmente! Solo tengo problemas con la versión.