Contrôles Google Maps

Google Maps - Contrôles par défaut

Lorsque la carte Google standard est affichée, elle fournit un ensemble de contrôles par défaut :

• Zoom (Zoom) - Affiche un curseur ou des boutons "+/-" pour contrôler le niveau de zoom de la carte
• Déplacement (Pan) - Affiche le contrôle de déplacement pour déplacer la carte
• Type de carte (MapType) - Permet à l'utilisateur de basculer entre les types de carte (carte de route et carte satellite)
• Vue en 3D (Street View) - Affiche l'icône de la personne sur la rue (Pegman icon), que vous pouvez glisser sur la carte pour activer la vue en 3D

Google Maps - Plus de contrôles

En plus des contrôles par défaut, Google Maps offre :

• Échelle (Scale) - Affiche l'élément d'échelle de la carte
• Rotation (Rotate) - Affiche un petit icône circulaire, permettant de faire pivoter la carte
• Vue d'ensemble de la carte (Overview Map) - Affiche une vue d'aperçu de la carte, reflétant le point de vue actuel de la carte sur une aire plus large

Vous pouvez spécifier quels contrôles doivent être affichés lors de la création de la carte (dans MapOptions) ou modifier les options de la carte en appelant setOptions().

Google Maps - Désactiver les contrôles par défaut

Vous pouvez souhaiter désactiver les contrôles par défaut.

Pour cela, définissez l'attribut disableDefaultUI de la carte (dans l'objet des options de la carte) sur true :

实例

var mapOptions {disableDefaultUI: true}

Google Maps - Ouvrir tous les contrôles

Certains contrôles apparaissent par défaut sur la carte ; d'autres ne le font pas, sauf si vous les définissez.

Veuillez spécifier dans l'objet des options de la carte les contrôles à ajouter ou supprimer à la carte.

Définir le contrôle sur true le rend visible - Définir le contrôle sur false le cache.

Cet exemple ouvre tous les contrôles :

实例

var mapOptions {
  panControl: true,
  zoomControl: true,
  mapTypeControl: true,
  scaleControl: true,
  streetViewControl: true,
  overviewMapControl: true,
  rotateControl: true
{}

谷歌地图 - 修改控件

一些地图控件是可配置的。

可以通过规定控件的选项字段来修改控件。

例如，在 zoomControlOptions 字段中规定了用于修改 Zoom 控件的选项。zoomControlOptions 字段可能包含：

• google.maps.ZoomControlStyle.SMALL - 显示迷你缩放控件（仅 + 和 - 按钮）
• google.maps.ZoomControlStyle.LARGE - 显示标准缩放滑块控件
• google.maps.ZoomControlStyle.DEFAULT - 根据设备和地图大小选择最佳缩放控件

实例

zoomControl: true,
zoomControlOptions: {
    style: google.maps.ZoomControlStyle.SMALL
{}

注意：如果要修改控件，请首先启用该控件（将其设置为 true）。

另一个可配置的控件是 MapType 控件。

mapTypeControlOptions 字段中规定了用于修改控件的选项。mapTypeControlOptions 字段可能包含：

• google.maps.MapTypeControlStyle.HORIZONTAL_BAR - 为每种地图类型显示一个按钮
• google.maps.MapTypeControlStyle.DROPDOWN_MENU - 通过下拉菜单选择地图类型
• google.maps.MapTypeControlStyle.DEFAULT - 显示“默认”行为（取决于屏幕尺寸）

实例

mapTypeControl: true,
mapTypeControlOptions: {
  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
{}

您还可以使用 ControlPosition 属性来定位控件：

实例

mapTypeControl: true,
mapTypeControlOptions: {
  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
  position: google.maps.ControlPosition.TOP_CENTER
{}