Переместите масштабную панель вправо с помощью Google Maps API v3 - PullRequest
Новая
       7

Переместите масштабную панель вправо с помощью Google Maps API v3

13 голосов
/ 08 ноября 2011

Я хочу переместить элементы управления масштабированием в API JavaScript Карт Google слева направо. Если мы оставим настройки по умолчанию, у нас есть это: default google api

Если я переместу это так: 

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

Тогда мы получим это:

right api

Я также заметил, что если вы установите его влево (не по умолчанию), вы получите:

left

В идеале мне бы хотелось, чтобы оно было справа и по центру элементов управления панорамированием, точно так же, как настройки по умолчанию, но с другой стороны. Есть ли способ сделать это?

1 Ответ

21 голосов
/ 08 ноября 2011

Да, вы можете сделать это. Вы должны поместить и panControl и zoomControl в одну позицию - либо google.maps.ControlPosition.TOP_RIGHT, либо google.maps.ControlPosition.RIGHT_TOP.

Используйте либо: 

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

или 

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

Простое объяснение состоит в том, что у карт Google есть контейнер в каждой позиции управления. Каждый из этих контейнеров располагается и масштабируется так, чтобы в него помещались все необходимые элементы управления. Элемент управления затем центрируется, если остается некоторое пространство (в этом случае ширина контейнера определяется шириной panControl). Если вы поместите элементы управления в отдельные позиции, они будут помещены в отдельные контейнеры, которые масштабируются и располагаются соответствующим образом.

...