Personnalisation des repères de base

Sélectionnez une plate-forme : Android iOS JavaScript

Image 3D de New York avec l'Empire State Building et trois repères numériques personnalisés flottant au-dessus, dont un gorille de dessin animé portant la mention

Vous pouvez personnaliser l'apparence des repères à l'aide du constructeur pinConfiguration. Le constructeur pinConfiguration fournit des méthodes permettant de modifier la couleur de l'arrière-plan et de la bordure, le texte et la couleur du glyphe, l'altitude, l'image à utiliser, ainsi que d'autres options de personnalisation.

L'exemple de code suivant montre comment créer un repère et le styliser à l'aide de certaines des options de personnalisation disponibles :

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     backgroundColor = Color.GREEN
     borderColor = Color.GREEN
     glyph = Glyph.fromColor(Color.RED)
   }
 }
)

Cette page explique comment personnaliser les repères de différentes manières :

Redimensionner le repère
Modifier la couleur d'arrière-plan
Modifier la couleur de la bordure
Ajouter du texte à un glyphe
Utiliser une image comme repère
Supprimer des repères

Redimensionner le repère

Pour mettre un repère à l'échelle, utilisez l'option scale :

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     scale = 3.14
   }
 }
)

Modifier la couleur d'arrière-plan

Utilisez l'option PinElement.background pour modifier la couleur d'arrière-plan d'un repère lors de la construction :

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     backgroundColor = Color.GREEN
   }
 }
)

Modifier la couleur de la bordure

Utilisez l'option markerOptions.borderColor pour modifier la couleur de la bordure d'un repère lors de la construction :

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     borderColor = Color.GREEN
   }
 }
)

Ajouter du texte à un glyphe

Utilisez la méthode markerOptions.glyph pour remplacer le glyphe par défaut par un caractère de texte. Le glyphe de texte du repère est mis à l'échelle avec le repère :

map.addMarker(
 markerOptions {
   position = sanFrancisco
   style = pinConfiguration {
     glyph = Glyph.fromText("G")
   }
 }
)

Utiliser une image comme repère

Map.addMarker(markerOptions {
  position = latLngAltitude {
      latitude = 40.7484
      longitude = -73.9857
      altitude = 100.0
  }
  zIndex = 1
  label = "Empire State Building"
  isExtruded = true
  isDrawnWhenOccluded = true
  altitudeMode = AltitudeMode.RELATIVE_TO_MESH
  setStyle(ImageView(R.drawable.ook))
})

Supprimer des repères

Utilisez Marker.remove() pour supprimer des repères de la carte :

marker.remove();