如何创建地图 ID

请选择平台： Android Android 3D iOS iOS 3D JavaScript Web 服务

地图 ID 是一个唯一标识符，代表存储在 Google Cloud 中的 Google 地图样式和配置设置。您可以使用地图 ID 在网站和应用中启用功能或管理地图或设置自定样式的地图。您可以在 Google Cloud 控制台项目的地图管理页面中，为您需要的每个平台（JavaScript、Android、iOS 或静态地图）创建地图 ID。

如需详细了解使用地图 ID 的功能，请参阅地图 ID 概览。

所需权限

如需在项目中创建或管理任何地图 ID，您必须在项目的 Cloud 控制台 IAM 页面上使用具有适当角色级权限（“Editor”或“Owner”）的主账号。如需了解详情，请参阅 IAM 基本角色和预定义角色参考文档。

创建地图 ID

按照以下步骤在 Cloud 控制台中创建地图 ID：

  1. 使用所需权限登录并打开 Cloud 控制台项目。

  2. 在 Cloud 控制台中，前往“地图管理”页面。

  3. 点击创建地图 ID。

    创建新的地图 ID

  4. 在创建新的地图 ID 页面上，执行以下操作：

    1. 在名称部分，为地图 ID 指定一个名称。
    2. 可选：在说明部分，描述地图 ID 的用途。
    3. 在地图类型部分，选择您计划在哪个平台上使用该地图 ID。如果您选择 JavaScript，请同时选择栅格（默认）或矢量地图类型。如需详细了解矢量地图，请参阅矢量地图。
    4. 点击保存，显示新的地图 ID。

将地图 ID 与地图样式相关联

如果您使用的是云端地图样式设置，则需要将地图样式与地图 ID 相关联。如需了解详情，请参阅将样式与地图 ID 相关联。

为您的应用添加地图 ID

Android

您可以使用 MapView 类（或以编程方式使用 GoogleMapOptions 类），通过 activity 布局文件中的 <fragment> 元素添加地图 ID。

例如，假设您创建了地图 ID，它作为一个名为 map_id 的字符串值存储在 res/values/strings.xml 中：

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="map_id">MAP_ID</string>
</resources>

对于通过 activity 布局文件中的 <fragment> 元素添加的地图，所有应具有自定义样式的地图 fragment 都必须在 map:mapId 属性中指定地图 ID：

<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
    map:name="com.google.android.gms.maps.SupportMapFragment"
    …
    map:mapId="@string/map_id" />

您还可以使用 MapView 类的 map:mapId 属性来指定地图 ID：

<com.google.android.gms.maps.MapView
    xmlns:map="http://schemas.android.com/apk/res-auto"
    ....
    map:mapId="@string/map_id" />

如需以编程方式指定地图 ID，请使用 GoogleMapOptions 类将其传递给 MapFragment 实例：

Java

 MapFragment mapFragment = MapFragment.newInstance(
     new GoogleMapOptions()
         .mapId(getResources().getString(R.string.map_id)));

Kotlin

 val mapFragment = MapFragment.newInstance(
     GoogleMapOptions()
         .mapId(resources.getString(R.string.map_id))
 )

在 Android Studio 中，像往常一样构建并运行应用。在第一步中配置的自定义样式会应用于具有指定地图 ID 的所有地图。

Android 3D

以编程方式或使用布局属性在 Map3DOptions 上设置 mapId 字符串属性。Map3DOptions 会在实例化期间提供给 Map3DView 对象，并且在 Map3DView 构建后无法更改。

添加地图 ID，以程序化方式创建地图：

import com.google.android.gms.maps3d.GoogleMap3D
import com.google.android.gms.maps3d.Map3DOptions
import com.google.android.gms.maps3d.Map3DView
import com.google.android.gms.maps3d.OnMap3DViewReadyCallback
import com.google.android.gms.maps3d.model.Map3DMode

class MainActivity : Activity(), OnMap3DViewReadyCallback {
  fun onCreate(...) {
    val map3DOptions = Map3DOptions(mapMode = Map3DMode.HYBRID, mapId = "MAP_ID")
    val map3DView = Map3DView(context, map3DOptions)
    map3DView.getMap3dViewAsync(this)
  }
}

使用布局属性添加地图 ID：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:map3d="http://schemas.android.com/apk/res-auto"
   android:layout_width="match_parent" android:layout_height="match_parent">
 <com.google.android.gms.maps3d.Map3DView
     android:id="@+id/map3dView"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     map3d:mode="hybrid"
     map3d:mapId="MAP_ID"/>
</LinearLayout>

iOS

如需使用地图 ID 将地图实例化，请执行以下操作：

  1. 使用 Cloud 控制台中的地图 ID 字符串创建 GMSMapID。
  2. 创建一个 GMSMapView，并指定您刚刚创建的地图 ID。

Swift

let camera = GMSCameraPosition(latitude: 47.0169, longitude: -122.336471, zoom: 12)
let mapID = GMSMapID(identifier: "MAP_ID")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: camera)
self.view = mapView

Objective-C

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:47.0169
                                                        longitude:-122.336471
                                                             zoom:12];
GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"MAP_ID"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
self.view = mapView;

如果您使用的是自己的地图 ID，则可以随时在 Cloud 控制台中设置地图 ID，使其具有新样式，并且该样式会在大约 6 小时内自动反映在您和用户的地图视图中。

如果您想立即看到更改，可以关闭并重启应用，方法是退出应用，从最近使用的应用列表中强制退出应用，然后重新打开应用。然后，您就可以看到更新后的地图。

iOS 3D

iOS 开发者可以在 Map 上设置新的 style 修饰符。此修饰符接受地图 ID，并可选择在地图 ID 无效或未找到时调用闭包。

import SwiftUI
import GoogleMaps3D

struct ContentView: View {
  init () {
    Map.apiKey = "YOUR_API_KEY"
  }
  var body: some View {
    Map(initialCamera: .init(
        latitude: 0.0,
        longitude: 0.0,
      ),
      mode: .hybrid
    )
    .style(
      with: "MAP_ID",
      error: {
        // Handle styling error.
      }
    )
    // Could also use trailing closure syntax
    //  .style(with: "MAP_ID") {
    //     // Handle styling error.
    //  }
  }
}

JavaScript

如需在应用代码中创建具有地图 ID 的地图，请执行以下操作：

  1. 如果您已使用嵌入式 JSON 代码自定义地图，请从 MapOptions 对象中移除 styles 属性；否则，请跳过此步骤。

  2. 使用 mapId 属性向地图添加地图 ID。例如：

map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});

JavaScript 3D

如需在应用中创建具有地图 ID 的地图，请使用 mapId 属性向地图添加地图 ID。例如：

async function init() {
    const { Map3DElement } = await google.maps.importLibrary('maps3d');

    const map = new Map3DElement({
        center: {
            lat: 37.75183154601466,
            lng: -119.52369070507672,
            altitude: 2200,
        },
        tilt: 67.5,
        heading: 108.94057782079429,
        range: 6605.57279990986,
        mapId: 'bcce776b92de1336e22c569f', // Styles are associated with map IDs.
        mode: 'HYBRID',
    });

    document.body.append(map);
}

void init();

静态地图

如需向使用我们的某个 Web 服务 API 的新地图或现有地图添加地图 ID，请附加 map_id 网址参数，并将其设置为您的地图 ID。此示例展示了如何使用 Maps Static API 向地图添加地图 ID。

<img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY&map_id=MAP_ID&signature=YOUR_SIGNATURE" />

一张以美国纽约州纽约市布鲁克林大桥为中心的地图，右下角有地图控件。地图上显示了道路、水域和陆地的自定义样式。

如果您在添加地图 ID 之前在 Maps Static 网址中使用了数字签名，则需要在添加地图 ID 后创建并添加新的数字签名。生成新的网址签名密钥时，请务必从网址中移除之前的数字签名。