Visão geral

Com os recursos com tecnologia WebGL para a API Maps JavaScript, você controla a inclinação e a rotação, adiciona objetos 3D ao mapa e muito mais. Os recursos a seguir estão incluídos:

Começar

Para usar os novos recursos do WebGL, você precisa de um ID do mapa que use o mapa vetorial. Também será necessário atualizar a solicitação de bootstrap da API. Veja nesta seção como fazer isso.

Criar um novo ID do mapa

Para criar um novo ID do mapa, siga as etapas em Usar a estilização de mapas baseada na nuvem: obter um ID do mapa. Defina o tipo de mapa como JavaScript e selecione a opção Vetor. Marque Inclinação e/ou Rotação para ativar essas opções no mapa. Com isso, você ajusta de forma programática esses valores, e os usuários ajustam a inclinação e a direção no mapa. Se o uso de inclinação ou direção afetar negativamente seu app, deixe as opções Inclinação e Rotação desmarcadas para que não possam ser ajustadas pelos usuários.

Criar ID de mapa vetorial

Atualizar o código de inicialização do seu mapa

Isso exige o ID do mapa que você acabou de criar. Ele pode ser encontrado na página Gerenciamento de mapas. Informe um ID ao instanciar o mapa usando a propriedade mapId, conforme mostrado aqui:

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

Exemplos

Veja alguns exemplos para mostrar esses recursos: