Calques de trafic, de trajets et de trajets à vélo

Les calques Trafic, Transports en commun et À vélo modifient le calque de carte de base pour afficher les conditions de circulation en temps réel ou des informations sur les itinéraires en transports en commun et à vélo. Ces calques sont disponibles dans certaines régions seulement.

Calque Trafic

L'API Maps JavaScript vous permet d'ajouter à vos cartes des informations en temps réel sur les conditions de circulation (dans certaines régions seulement) au moyen de l'objet TrafficLayer. Les informations sur le trafic sont actualisées fréquemment, mais pas instantanément. Il est peu probable que les requêtes rapides consécutives pour la même zone produisent des résultats différents.

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 13,
      center: { lat: 34.04924594193164, lng: -118.24104309082031 },
    }
  );

  const trafficLayer = new google.maps.TrafficLayer();

  trafficLayer.setMap(map);
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 13,
    center: { lat: 34.04924594193164, lng: -118.24104309082031 },
  });
  const trafficLayer = new google.maps.TrafficLayer();

  trafficLayer.setMap(map);
}

window.initMap = initMap;
index.js
Voir un exemple

Essayer avec un exemple

Calque Transports en commun

L'API Maps JavaScript permet d'afficher sur votre carte le réseau de transport en commun d'une ville au moyen de l'objet TransitLayer. Lorsque le calque Transit est activé et que la carte est centrée sur une ville qui prend en charge les informations sur les transports en commun, la carte affiche les principales lignes de transport en commun sous la forme de lignes de couleur au trait épais. La couleur de la ligne est définie en fonction des informations fournies par la régie des transports concernée. Activer le calque Transit modifie le style de la carte de base pour mieux mettre en évidence les itinéraires de transport en commun.

Si vous travaillez dans une agence publique qui supervise les transports en commun de votre ville et que vous souhaitez ajouter vos données, veuillez consulter le site du Programme de partenariat Google Transports en commun pour en savoir plus.

L'exemple suivant montre le calque Transit activé sur une carte de Londres, au Royaume-Uni.

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 13,
      center: { lat: 51.501904, lng: -0.115871 },
    }
  );

  const transitLayer = new google.maps.TransitLayer();

  transitLayer.setMap(map);
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 13,
    center: { lat: 51.501904, lng: -0.115871 },
  });
  const transitLayer = new google.maps.TransitLayer();

  transitLayer.setMap(map);
}

window.initMap = initMap;
index.js
Voir un exemple

Essayer avec un exemple

Calque À vélo

L'API Maps JavaScript permet d'ajouter à vos cartes des informations sur les itinéraires à vélo au moyen de l'objet BicyclingLayer. L'objet BicyclingLayer affiche au-dessus d'une carte donnée un calque représentant des pistes cyclables, des suggestions d'itinéraires à vélo et autres superpositions spécifiques à l'usage du vélo. Ce calque modifie par ailleurs le style de la carte de base pour mettre en avant les rues dotées de pistes cyclables et, au contraire, atténuer les rues déconseillées pour le vélo.

L'exemple suivant montre le calque Bicycle activé sur une carte de Cambridge, dans le Massachusetts :

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 14,
      center: { lat: 42.3726399, lng: -71.1096528 },
    }
  );

  const bikeLayer = new google.maps.BicyclingLayer();

  bikeLayer.setMap(map);
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;
index.ts

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 14,
    center: { lat: 42.3726399, lng: -71.1096528 },
  });
  const bikeLayer = new google.maps.BicyclingLayer();

  bikeLayer.setMap(map);
}

window.initMap = initMap;
index.js
Voir un exemple

Essayer avec un exemple

Les itinéraires en vert foncé désignent des voies réservées aux vélos. Les itinéraires en vert clair indiquent les rues dotées de bandes cyclables. Les itinéraires en pointillés désignent des rues ou chemins recommandés pour le vélo.