I've got a Google Map with some controls in the bottom right corner (the other 3 corners are already occupied, so these all need to be in the same corner). I set it up like so:
mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.SATELLITE],
position: google.maps.ControlPosition.RIGHT_BOTTOM
},
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL,
position: google.maps.ControlPosition.RIGHT_BOTTOM
},
streetViewControlOptions: {
position: google.maps.ControlPosition.RIGHT_BOTTOM
}
This produces the following result:
...that looks silly, so I tried switching the mapTypeControl to the BOTTOM_RIGHT
position:
Ideally, this is what I'd like (the same as the first, but with the mapTypeControl at the bottom):
I've dug through the API docs, and while it looks like there's a way to control the order of custom controls, I don't see a way to re-arrange native ones. Can this be done? If it's not possible to do it quite like my last example, is there at least a better way to arrange the controls so none of them stick out like a sore thumb?