Usar IDs de mapa

Recurso pago: a funcionalidade acessada ao adicionar um ID do mapa aciona um carregamento cobrado na SKU do Dynamic Maps para Android e iOS. Consulte Faturamento do Google Maps para mais informações.

Um ID de mapa é um identificador exclusivo usado para representar uma única instância de um mapa do Google. Você usa IDs de mapa para ativar recursos ou gerenciar ou estilizar mapas nos seus sites e aplicativos. É possível criar IDs de mapa para cada plataforma necessária (JavaScript, Android, iOS ou mapas estáticos) no projeto do console do Google Cloud na página Gerenciamento de mapas.

O que você pode fazer com IDs de mapa

Use IDs de mapa para ativar recursos e estilos. Confira alguns exemplos de como usar os IDs de mapa. Para conferir uma lista completa, consulte Recursos que usam IDs de mapas:

• Estilo de mapa baseado na nuvem: associe um ID a um estilo de mapa para estilizar, personalizar e gerenciar seus mapas usando o Console do Google Cloud. Disponível em todas as plataformas: JavaScript, Android, iOS e API Maps Static.

• Mapas vetoriais: use um ID de mapa para usar um mapa composto por blocos baseados em vetores que são renderizados no momento do carregamento no lado do cliente usando o WebGL. Disponível em JavaScript.

• Marcadores avançados: use um ID de mapa para ativar os Marcadores Avançados. Disponível em JavaScript, Android e iOS.

Exemplo de estilização de mapas baseada na nuvem

Para usar a Estilização de mapas baseada na nuvem no seu site e apps Android, siga estas etapas:

1. Crie IDs de mapas para cada plataforma que você está usando. Por exemplo, crie um JavaScript e um ID do mapa do Android. Para saber mais, consulte Criar IDs de mapa.

2. Configure um estilo de mapa no console do Google Cloud. Saiba mais em Estilização de mapas baseada na nuvem.

3. Associe os dois IDs de mapa ao estilo no Console do Google Cloud. Para mais detalhes, consulte Associar IDs de mapas ao seu estilo.

4. Faça referência ao ID do mapa no JavaScript do seu site e no código do seu app Android. Para saber mais, consulte Adicionar um ID do mapa ao seu app.

O estilo associado aos seus IDs de mapa é exibido no seu site e no seu app Android. É possível fazer atualizações no estilo do mapa no Cloud Console, e as mudanças aparecem nos dois lugares automaticamente, sem que os clientes precisem atualizar o app.

Recursos que usam IDs de mapa

A tabela a seguir mostra os recursos e as APIs da Plataforma Google Maps que usam IDs de mapa:

Recurso ou API	Usa IDs de mapa para alcançar essas metas
Marcadores avançados	Ative os marcadores avançados. Não é necessário criar um ID do mapa. Use o ID de mapa de exemplo "DEMO_MAP_ID".
Estilo baseado em dados para limites	Associe o ID do mapa a um conjunto de limites e estilos para estilizar o mapa de acordo com os limites.
Estilo baseado em dados para conjuntos de dados	Associe o ID do mapa a um conjunto de dados e estilos para estilizar o mapa de acordo com o conjunto de dados.
Flutter	Dê estilo aos mapas do Google usados nos seus apps Flutter.
API Maps Embed	Especifique e estilize o mapa a ser incorporado em uma página da Web.
API Maps JavaScript	Estilize o mapa para que ele seja exibido em uma página da Web.
SDK do Maps para Android	Estilize o mapa para ser exibido em um app Android.^1
SDK do Maps para iOS	Dê estilo ao mapa que será exibido em um aplicativo iOS.^1
API Maps Static	Especifique e estilize o mapa para ser renderizado como uma imagem estática.
Soluções de mobilidade	Use a API Maps JavaScript e os SDKs para Android e iOS para estilizar mapas em soluções de mobilidade.^1
WebGL (mapas vetoriais)	Ative os recursos do WebGL usando um ID do mapa vetorial JavaScript.

¹ O uso de um ID do mapa no SDK do Maps para Android ou para iOS aciona um carregamento de mapa que é cobrado na SKU do Dynamic Maps.

Como criar e usar IDs de mapa

Um ID de mapa é um identificador exclusivo que representa uma única instância de um mapa do Google. Você cria IDs de mapa e atualiza o estilo associado a um ID no Console do Cloud.

Permissões necessárias

Para criar ou gerenciar IDs de mapa no seu projeto, use um principal com as permissões adequadas no nível do papel, editor ou proprietário, na página do IAM do Console do Cloud para o projeto. Para mais detalhes, consulte a Referência dos papéis básicos e predefinidos do IAM.

Criar IDs de mapa

É possível criar IDs de mapa e atualizar um estilo associado a um deles a qualquer momento no Console do Cloud.

Para criar um ID de mapa, siga estas etapas:

1. Faça login e abra um projeto do console do Cloud com as permissões necessárias.

2. No Console do Cloud, acesse a página Gerenciamento de mapas.

3. Selecione Criar ID do mapa.

   

4. Na página Criar novo ID de mapa, faça o seguinte:

   1. Em Nome, atribua um nome ao ID do mapa.
   2. Opcional: em Descrição, explique para que o ID do mapa é usado.
   3. Em Tipo de mapa, selecione a plataforma em que você planeja usar o ID do mapa. Se você escolher JavaScript, escolha também um tipo de mapa Raster (padrão) ou Vetor. Para mais informações sobre mapas vetoriais, consulte Mapas vetoriais.
   4. Selecione Salvar para mostrar o novo ID do mapa.

Associar um ID de mapa a um estilo

Estas instruções presumem que haja pelo menos um estilo de mapa no seu projeto. Se você não tiver estilos de mapa, consulte Estilização de mapas baseada na nuvem e selecione sua plataforma para ver instruções sobre como criar um.

1. No Console do Cloud, acesse a página Gerenciamento de mapas.
2. Na tabela, selecione um ID de mapa.
3. Em Estilo de mapa associado, selecione uma opção.

4. Selecione Salvar.

   

Adicionar o ID do mapa ao seu app

Android

Adicione o ID do mapa com um elemento <fragment> no arquivo de layout da atividade usando a classe MapView ou de forma programática usando a classe GoogleMapOptions.

Por exemplo, suponha que você tenha criado um ID do mapa armazenado como um valor de string chamado map_id em res/values/strings.xml:

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

No caso de mapas adicionados usando um elemento <fragment> no arquivo de layout da atividade, todos os fragmentos que devem ter o estilo personalizado precisam especificar o ID do mapa no atributo map:mapId:

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

Você também pode usar o atributo map:mapId da classe MapView para especificar um ID do mapa:

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

Se quiser especificar um ID de mapa de maneira programática, transmita-o para uma instância MapFragment usando a classe GoogleMapOptions:

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))
 )

No Android Studio, crie e execute seu app normalmente. Os estilos personalizados configurados na primeira etapa são aplicados a todos os mapas com o ID especificado.

iOS

Para instanciar um mapa usando um ID, faça o seguinte:

1. Crie um GMSMapID com a string do ID do mapa no console do Cloud.
2. Crie um GMSMapView especificando o ID do mapa que você acabou de criar.

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;

Se você estiver usando seu próprio ID do mapa, poderá definir um novo estilo no Cloud Console a qualquer momento. Esse estilo será refletido na visualização do mapa automaticamente para você e os usuários em cerca de seis horas.

Se você quiser conferir as mudanças imediatamente, feche e reinicie o app. Para isso, saia dele, forçando o encerramento da lista de apps usados recentemente e reabrindo-o. O mapa atualizado vai aparecer.

JavaScript

Para criar um mapa com um ID no código do aplicativo:

1. Se você já está personalizando seu mapa com um código JSON incorporado, remova a propriedade styles do objeto MapOptions. Caso contrário, pule esta etapa.

2. Adicione um ID ao mapa usando a propriedade mapId. Exemplo:

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

Maps Static

Para adicionar um ID do mapa a um mapa novo ou existente que usa uma das nossas APIs de serviço da Web, anexe o parâmetro de URL map_id e defina-o como o ID do mapa. Este exemplo mostra como adicionar um ID de mapa a um mapa usando a API Maps Static.

<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" />

Se você tiver uma assinatura digital no URL estático do Maps antes de adicionar o ID do mapa, será necessário criar e adicionar uma nova assinatura digital depois de adicionar o ID do mapa. Ao gerar o novo segredo de assinatura de URL, remova a assinatura digital anterior do URL.