路况图层、公交图层和骑车图层

使用集合让一切井井有条 根据您的偏好保存内容并对其进行分类。

路况图层、公交图层和骑车图层会修改基本地图图层,以显示当前路况、本地公交网络或骑车路线信息。这些图层仅在部分区域提供。

路况图层

借助 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;
查看示例

试用示例

Transit 图层

借助 Maps JavaScript API,您可以使用 TransitLayer 对象在地图上显示城市的公交网络。启用公交图层后,如果地图的中心是支持公交信息的城市,则地图会以粗色的彩色线条显示主要的公交线路。线条的颜色根据公交线路运营商提供的信息设置。启用公交图层会更改基本地图的样式,以便更好地强调公交路线。

只有部分地点可提供公交信息。如需查看当前提供公交信息的城市列表,请参阅此列表

如果您是负责监管所在城市公共交通的公共机构,并希望加入您的数据,请访问 Google 公交合作伙伴计划网站了解详情。

下例显示的是在英国伦敦地图上启用的 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;
查看示例

试用示例

Bicycling 图层

借助 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;
查看示例

试用示例

深绿色路线表示专用的自行车路线。浅绿色路线表示有专用“自行车道”的街道。虚线路线表示不建议骑车的街道或路径。