O melhor tutorial Google Maps conjunto de controle em 2024. Neste tutorial você pode aprender
Google Maps - conjunto de controle padrão está definido:,Google Maps - mais conjunto de controle,Google Maps - Desligue o conjunto de controle padrão,Exemplos,Google Maps - todos os controles estabelecidos para abrir,Exemplos,Google Maps - modificar o conjunto de controle,Exemplos,Exemplos,Exemplos,Google Maps - jogo de controle personalizado,Exemplos,Google Maps - Conjunto de Controle Manual de Referência,
Google Maps conjunto de controle
Um mapa do Google - o conjunto de controle padrão está definido:
Google Maps - conjunto de controle padrão está definido:
Ao usar um mapa do Google padrão, as configurações padrão são as seguintes:
- .Zoom- Exibe uma barra deslizante para controlar o mapa do nível de zoom
- .PPan- Na exibição de mapa é um apartamento controles tigela-como, clique sobre os quatro cantos da panela o mapa
- .MapType- Permite ao usuário selecionar entre os tipos de mapa (roteiro e Satallite) Alternar
- .StreetView- Aparece como um ícone Pegman, você pode arrastá-lo para um ponto no mapa para abrir Street View
Google Maps - mais conjunto de controle
Além do conjunto de controle padrão acima, o Google também:
- .Scale- Exibição escala do mapa
- .Rotate- Mostrar uma pequena circunferência do ícone, você pode rodar o mapa
- .verview vista do plano Map-a partir da perspectiva de um mapa de área ampla
Quando você cria um mapa que você pode especificar qual conjunto de controles é exibida, definindo a opção ou ligando setOptions () para alterar o mapa opções de configuração.
Google Maps - Desligue o conjunto de controle padrão
Você pode querer desligar o conjunto padrão de controles.
Para desligar o conjunto de controle padrão, defina a propriedade para mapear disableDefaultUI verdadeira:
Exemplos
disableDefaultUI:true
tente »
Google Maps - todos os controles estabelecidos para abrir
Alguns controles definem a exibição padrão no mapa, enquanto outros não, a menos que você configurá-los.
Definir o controle para torná-lo visível verdade - Definir o controle para false para escondê-lo.
Os exemplos a seguir estão abertos todos os controles:
Exemplos
panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true
tente »
Google Maps - modificar o conjunto de controle
Alguns controles mapas são configuráveis. Alterar o controle definido através do desenvolvimento de campo de opções de controle.
F Por exemplo, para modificar a opção de controle de zoom especifica zoomControlOptions. zoomControlOptions contém os seguintes três opções:
- .google.maps.ZoomControlStyle.SMALL- exibição minimizar controle de zoom
- .google.maps.ZoomControlStyle.LARGE- zoom padrão de apresentação de slides controles
- .google.maps.ZoomControlStyle.DEFAULT- equipamentos e tamanho do mapa base, selecione o controle mais adequado
Exemplos
zoomControl : true ,
zoomControlOptions :
{
style : google . maps . ZoomControlStyle . SMALL
}
tente » Nota: Se vocêprecisar modificar um controle, primeiro controle turno (configurá-lo para true).
Outro controle é o controle MapType.
MapType controle podem aparecer em uma das seguintes opções de estilo:
- google.maps.MapTypeControlStyle.HORIZONTAL_BAR, em uma barra horizontal aparece como um conjunto de botões de controle como mostrado no Google Maps.
- google.maps.MapTypeControlStyle.DROPDOWN_MENU, para a exibição de um único controle de botão, permitindo que você selecione o tipo de mapa a partir do menu drop-down.
- google.maps.MapTypeControlStyle.DEFAULT, para exibir o comportamento "default", que depende do tamanho da tela e pode mudar em versões futuras da API.
Exemplos
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU
}
tente » Da mesma forma, você pode usar o controle de propriedade localização ControlPosition especificado:
Exemplos
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position:google.maps.ControlPosition.TOP_CENTER
}
tente »
Google Maps - jogo de controle personalizado
Criar um controle personalizado para retornar a Londres para o evento Click: (Se o mapa é arrastado):
Exemplos
controlDiv.style.padding = '5px';
var controlUI = document.createElement('div');
controlUI.style.backgroundColor = 'yellow';
controlUI.style.border='1px solid';
controlUI.style.cursor = 'pointer';
controlUI.style.textAlign = 'center';
controlUI.title = 'Set map to London';
controlDiv.appendChild(controlUI);
var controlText = document.createElement('div');
controlText.style.fontFamily='Arial,sans-serif';
controlText.style.fontSize='12px';
controlText.style.paddingLeft = '4px';
controlText.style.paddingRight = '4px';
controlText.innerHTML = '<b>Home<b>'
controlUI.appendChild(controlText);
tente »
Google Maps - Conjunto de Controle Manual de Referência
Google Maps API Manual de Referência .