一切就绪!

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

激活 Google Maps Android API

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

  1. 创建或选择项目
  2. 激活 Google Maps Android API
  3. 创建相应密钥
继续

添加样式化地图

本教程介绍如何将带自定义样式的地图添加到 Android 应用。 本教程将夜间模式作为自定义样式的示例。

您可以通过样式选项自定义标准 Google 地图样式的呈现方式,从而更改道路、公园、商家和其他景点等特征的视觉显示。

这意味着您可以突出地图的特定组件或根据应用的样式创建地图组件。

样式设置仅对 normal 地图类型有效。

获取代码

从 GitHub 克隆或下载 Google Maps Android API v2 Samples 存储区

设置您的开发项目

按照以下步骤在 Android Studio 中创建教程项目。

  1. 下载安装 Android Studio。
  2. Google Play 服务软件包添加到 Android Studio。

  3. 克隆或下载 Google Maps Android API v2 Samples 存储区(如果您在开始阅读此教程时未执行该操作。

  4. 导入教程项目:

    • 在 Android Studio 中,选择 File > New > Import Project
    • 转到 Google Maps Android API v2 Samples 存储区下载后的保存位置。

    • 在以下位置查找 StyledMap 项目:
      PATH-TO-SAVED-REPO/android-samples/tutorials/StyledMap

    • 选择项目目录,然后点击 OK。 Android Studio 现在将使用 Gradle 构建工具构建您的项目。

获取 API 密钥并启用必要的 API。

要完成本教程,您需要一个已获得 Google Maps Android API 使用授权的 Google API 密钥。

点击下面的按钮以获取密钥并激活 API。

获取密钥

如需了解更多详情,请参阅有关获取 API 密钥的完整指南。

将 API 密钥添加到您的应用

  1. 编辑您的项目的 gradle.properties 文件。
  2. 将您的 API 密钥粘贴到 GOOGLE_MAPS_API_KEY 属性的值中。 在您构建应用时,Gradle 将 API 密钥复制到应用的 Android 清单中。

    GOOGLE_MAPS_API_KEY=PASTE-YOUR-API-KEY-HERE
    

构建和运行您的应用

  1. 将 Android 设备连接到您的计算机。 按照说明在您的 Android 设备上启用开发者选项,并配置您的系统以检测设备。 (或者,您可以使用 Android Virtual Device (AVD) Manager 配置虚拟设备。 选择模拟器时,请务必选择一个包含 Google API 的映像。 如需了解更多详情,请参阅入门指南。)
  2. 在 Android Studio 中,点击 Run 菜单选项(或 play 按钮图标)。

按提示选择设备。

Android Studio 将调用 Gradle 以构建应用,然后在设备或模拟器上运行此应用。 您将看到一张具有黑色(夜间模式)样式的地图,与本页上的图像类似。

问题排查:

  • 如果您没有看到地图,请检查您是否已获取 API 密钥,以及是否已将其添加到应用,如上文所述。 在 Android Studio 的 Android Monitor 中查看日志,获取有关 API 密钥的错误消息。

  • 使用 Android Studio 调试工具查看日志并调试应用。

了解代码

此部分教程介绍 StyledMap 应用最重要的部分,以帮助您了解如何构建相似的应用。

添加包含 JSON 样式对象的资源

将资源添加到您的开发项目,从而包含 JSON 格式的样式声明。 您可以使用一个原始资源或字符串,如以下示例所示:

注:您从 GitHub 下载的示例应用使用一个原始资源。

原始资源

/res/raw/style_json.json 中定义一个原始资源,从而包含用于夜间模式样式设置的 JSON 样式声明:

字符串资源

/res/values/style_strings.xml 中定义一个字符串资源,从而包含用于夜间模式样式设置的 JSON 样式声明。 本教程使用字符串名称 style_json。 在此文件中,您需要使用一个反斜杠来转义引号:

将一个 JSON 样式对象传递到地图

要设置地图的样式,请调用 GoogleMap.setMapStyle(),从而传递一个 MapStyleOptions 对象,其包含 JSON 格式的样式声明。

原始资源

以下代码示例假定您的项目包含一个名为 style_json 的原始资源:

package com.example.styledmap;

import android.content.res.Resources;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;

import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a raw resource.
 */
public class MapsActivityRaw extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityRaw.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_raw);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        try {
            // Customise the styling of the base map using a JSON object defined
            // in a raw resource file.
            boolean success = googleMap.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(
                            this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

布局 (activity_maps_raw.xml) 如下所示:

字符串资源

以下代码示例假定您的项目包含一个名为 style_json 的字符串资源:

package com.example.styledmap;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;

import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a string resource.
 */
public class MapsActivityString extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityString.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_string);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        // Customise the styling of the base map using a JSON object defined
        // in a string resource file. First create a MapStyleOptions object
        // from the JSON styles string, then pass this to the setMapStyle
        // method of the GoogleMap object.
        boolean success = googleMap.setMapStyle(new MapStyleOptions(getResources()
                .getString(R.string.style_json)));

        if (!success) {
            Log.e(TAG, "Style parsing failed.");
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

布局 (activity_maps_string.xml) 如下所示:

有关 JSON 样式声明的详细信息

样式化地图利用两种概念对地图应用颜色和其他样式更改:

  • 选择器指定您可以在地图上设置样式的地理区域组件。 其中包括道路、公园、水体等项目以及它们的标签。 选择器包括特征元素,以 featureTypeelementType 属性表示。

  • 样式器是可应用于地图元素的颜色和可见性属性。 它们通过色调、颜色和亮度/伽马值的组合定义显示的颜色。

有关 JSON 样式设置选项的详细说明,请参阅样式参考

Google Maps APIs Styling Wizard

使用 Google Maps APIs Styling Wizard 可以快速生成一个 JSON 样式对象。 Google Maps Android API 支持与 Google Maps JavaScript API 相同的样式声明。

后续步骤

查看如何通过样式设置隐藏地图上的特征

发送以下问题的反馈:

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