Saltar al contenido

Ocultar el botón de pantalla completa predeterminado en react-google-maps

Solución:

Solo para incluirlo en las opciones predeterminadas

const defaultMapOptions = {
  fullscreenControl: false,
};

const InputGoogleMap = withGoogleMap(props=>(
  <GoogleMap
    ref={(map) => console.log()}
    defaultZoom={12}
    defaultCenter={{ lat: this.state.lat, lng: this.state.lng }}
    defaultOptions={defaultMapOptions}
  />
))

Para obtener más opciones de Google Maps, puede encontrarlo aquí: https://developers.google.com/maps/documentation/javascript/reference?csw=1#MapOptions

Creo que la biblioteca se actualizó: google-map-react 0.23

defaultOptions cambiado a options

const mapOptions = {
  fullscreenControl: false,
};

const Map = withGoogleMap(props=>(
  <GoogleMap
    defaultZoom={12}
    defaultCenter={{ lat: this.state.lat, lng: this.state.lng }}
    options={mapOptions}
  />
))

Espero eso ayude

Por encima de ambas soluciones no funcionó para mí. Dado que estaba usando algunos estilos personalizados junto con los estilos anteriores. Esto elimina tanto la pantalla completa como los botones de acercar y alejar.

const waterStyle = [
{
  featureType: "water",
  elementType: "geometry.fill",
  stylers: [
    {
      color: "#4BB4F5",
    },
  ],
},]

 <GoogleMap
    defaultCenter={{ lat: 0, lng: 0 }}
    defaultZoom={3}
    options={{
      styles: waterStyle,
      disableDefaultUI: true,
    }}
  >

Si solo desea ocultar el botón de pantalla completa que usa: los botones de acercar y alejar pueden estar visibles y usarse

 <GoogleMap
    defaultCenter={{ lat: 0, lng: 0 }}
    defaultZoom={3}
    options={{
      styles: waterStyle,
      fullscreenControl: false,
    }}
  >
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *