Слои загруженности дорог, общественного и велосипедного транспорта

Слои загруженности дорог, общественного и велосипедного транспорта добавляют к базовому слою карты информацию о текущей обстановке на дорогах, местных веломаршрутах и общественном транспорте. Эти слои доступны не во всех регионах.

Слой "Пробки"

Maps JavaScript API позволяет добавлять на карту информацию о загруженности дорог в реальном времени (если этот слой поддерживается в регионе) с помощью объекта TrafficLayer. Информация в слое обновляется часто, но не в реальном времени. Поэтому слишком часто повторяющиеся запросы для одной и той же области вряд ли будут давать разные результаты.

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;

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;
Посмотреть пример

Примеры кода

Слой общественного транспорта

Maps JavaScript API позволяет показывать на карте информацию о городском общественном транспорте с помощью объекта TransitLayer. Если этот слой активирован и в центре карты находится город, для которого доступна информация, главные маршруты общественного транспорта будут показаны на карте в виде толстых цветных линий. Цвета линий заданы оператором общественного транспорта. При активации слоя Transit стиль базовой карты меняется, чтобы маршруты общественного транспорта были более заметны.

Если вы представляете государственный орган, ответственный за городской общественный транспорт, и хотите добавить свои данные на карту, ознакомьтесь со сведениями на сайте Партнерской программы "Общественный транспорт".

В примере ниже показан слой общественного транспорта на карте Лондона (Великобритания).

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;

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;
Посмотреть пример

Примеры кода

Слой велосипедного транспорта

Maps JavaScript API позволяет показывать на карте информацию для велосипедистов с помощью объекта BicyclingLayer. Слой BicyclingLayer отображает на карте велодорожки, предполагаемые оптимальные маршруты и другие наложения с информацией для велосипедистов. Если слой активирован, стиль базовой карты меняется, чтобы выделить улицы с велодорожками и сделать менее заметными улицы, на которых передвижение на велосипеде запрещено.

В примере ниже показан слой велосипедного транспорта на карте Кембриджа (штат Массачусетс, США).

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;

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;
Посмотреть пример

Примеры кода

Темно-зеленые линии обозначают выделенные велодорожки. Светло-зеленые – улицы с велосипедными полосами, пунктирные – прочие улицы или дорожки, рекомендованные для велосипедистов.