一切就绪!

着手开发前,请先阅读我们的开发者文档

激活 Google Maps JavaScript API

为帮助您起步,我们将引导您在 Google Developers Console 中先完成几项任务:

  1. 创建或选择项目
  2. 激活 Google Maps JavaScript API 及相关服务
  3. 创建相应密钥
继续

概念

专为移动设备而开发

Google Maps JavaScript API 经过精心设计,可以快速加载到并流畅运行于移动设备。特别是,我们的开发一直侧重于高级移动设备,如 Android 和 iOS 手机。移动设备的屏幕尺寸比常规的桌面浏览器要小。此外,它们通常还具有这些设备专属的特殊行为(例如“捏拉缩放”)。如果您希望自己的应用能够在移动设备上流畅运行,我们建议您执行以下操作:

  • 将包含您的地图的 <div> 的高度和宽度属性均设置为 100%。不过请注意,有些旧的桌面浏览器在使用这些值时显示效果不佳。
  • 您可以通过在 DOM 中检查 navigator.userAgent 属性,来检测 iPhone 和 Android 设备:
    function detectBrowser() {
      var useragent = navigator.userAgent;
      var mapdiv = document.getElementById("map");
    
      if (useragent.indexOf('iPhone') != -1 || useragent.indexOf('Android') != -1 ) {
        mapdiv.style.width = '100%';
        mapdiv.style.height = '100%';
      } else {
        mapdiv.style.width = '600px';
        mapdiv.style.height = '800px';
      }
    }
    

    这允许您更改针对特定设备的布局,因为我们已经在此完成针对每款设备更改屏幕实际尺寸。

  • Android 和 iOS 设备遵守以下 <meta> 标记:

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    

    此设置指明地图应全屏显示且不能由用户调整大小。请注意,iPhone 的 Safari 浏览器要求在页面的 <head> 元素内包含此 <meta> 标记。

有关针对 iPhone 开发应用的详细信息,请参阅 Apple 的开发者文档。有关针对 Android 设备开发应用的详细信息,请参阅 Android 文档

本地化

可以通过更改默认语言设置以及指定区域代码来本地化 Google Maps JavaScript API 应用,后者会根据给定国家或地区改变地图的行为。阅读有关将地图本地化的内容。

版本控制

Google Maps JavaScript API 团队会定期更新 API,以加入新的功能、修复 bug 并提升其性能。您可以指明在您的应用中加载哪个版本的 API,为此,您只需在 Google Maps JavaScript API 引导程序请求的 v 参数中指明相应版本即可。阅读更多关于版本控制的内容。

发送以下问题的反馈:

此网页
Google Maps JavaScript API
Google Maps JavaScript API
需要帮助?请访问我们的支持页面