Mueva la barra de zoom hacia la derecha con Google Maps API v3

I'm looking to move the zoom controls in the Google Maps Javascript API from the left to the right. If we leave the default setup we have this: default google api

If I move it over like so:

panControl: true,
  panControlOptions: {
  position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.RIGHT_TOP
}

Then we get this:

right api

I've also noticed that if you set it to the left (not default), you get:

izquierda

Ideally I would like it on the right and centered to the pan controls just like the default settings but on the other side. Is there anyway of doing this?

preguntado el 08 de noviembre de 11 a las 10:11

1 Respuestas

Yes, you can do it. You have to put both panControl y zoomControl into one position - either google.maps.ControlPosition.TOP_RIGHT or google.maps.ControlPosition.RIGHT_TOP.

Utilizar cualquiera:

panControl: true,
panControlOptions: {
  position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.TOP_RIGHT
}

o bien:

panControl: true,
  panControlOptions: {
  position: google.maps.ControlPosition.RIGHT_TOP
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.RIGHT_TOP
}

A simple explanation is that Google maps have a container at each controls position. Each of these containers is positioned and scaled such that all the required controls fit in. A control is then centered if there's some remaining space (in this case the width of the container is specified by the width of panControl). If you put the controls into separate positions, they are put into separate containers which are scaled and positioned appropriately.

respondido 08 nov., 11:15

Hey, can we style it as well? If i want to add custom images or style for zoom buttons is that possible? - Roydon D' Souza

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.