3D 地图控件和探索

请选择平台: Android iOS JavaScript

控件概览

通过 Maps JavaScript API 中的 3D 地图显示的地图包含界面元素(称为探索控件),可支持用户与地图互动。默认情况下,探索控件会显示在地图界面中,但为了简单起见或为自定义控件留出空间,可以停用这些控件。请注意,当界面控件处于停用状态时,您可以使用键盘快捷键来探索地图。

Maps JavaScript API 中的 3D 地图还支持使用预设的相机路径引导用户浏览地图。您可以自定义和组合这些路径,以打造丰富的 3D 体验。

探索控制

下图显示了 Maps JavaScript API 中的 3D 地图会默认显示的一组控件:

显示控件的地图图片

下面列出了 Maps JavaScript 中的 3D 地图中的一整套控件:

  • 缩放控件:可显示“+”和“-”按钮,用于更改地图的缩放级别。
  • 移动控件:可显示“←”“→”“↑”和“↓”按钮,用于更改地图的中心。
  • 借助旋转控件,您可以更改相机的朝向。
  • 借助倾斜度控制,您可以更改相机的倾斜度。
  • 罗盘控件用于指示罗盘正北方向,并允许将相机重置为朝北方向。

以下代码示例演示了如何切换探索控件:

JavaScript

const map = new Map3DElement({
  center: { lat: 37.819852, lng: -122.478549, altitude: 2000 },
  tilt: 75,
  heading: 330,
  mode: MapMode.SATELLITE,
  defaultUIHidden: true,
});

HTML

<gmp-map-3d
  mode="hybrid"
  range="639.274301042242"
  tilt="64.92100184857551"
  center="34.0768990953219,-118.47450491266041,292.9794737933403"
  heading="-61.02026752077781"
  default-ui-disabled
></gmp-map-3d>

后续步骤