web-dev-qa-db-fra.com

Styling une polyligne Google Maps v3 avec des tirets ou des points?

J'aimerais prendre une carte basée sur Google Map V3 avec des polylignes personnalisées et faire certaines de ces lignes pointillées ou pointillées. Je n'arrive pas à trouver un moyen de le faire. Est-ce possible, et si oui, comment?

25
David Pfeffer

Cette fonctionnalité a été ajoutée aux options de polyligne et elle s'appelle symboles sur les polylines

Créer une ligne pointillée ressemble à ceci ( Demo ):

var lineCoordinates = [
  new google.maps.LatLng(22.291, 153.027),
  new google.maps.LatLng(18.291, 153.027)
];

var lineSymbol = {
  path: 'M 0,-1 0,1',
  strokeOpacity: 1,
  scale: 4
};

var line = new google.maps.Polyline({
  path: lineCoordinates,
  strokeOpacity: 0,
  icons: [{
    icon: lineSymbol,
    offset: '0',
    repeat: '20px'
  }],
  map: map
});

La longueur du tableau de bord est contrôlée par path s +/- 1, et l'espacement est contrôlé par repeat. C'est un peu verbeux, mais très flexible.

Outre les tirets, la nouvelle fonctionnalité comprend des chemins prédéfinis pour un cercle, des flèches et des documents incluent même une démonstration d'animation :)

64
Tina CG Hoehr