Najlepszy samouczek Google Maps kontroli wymienione W 2024 r. W tym samouczku możesz dowiedzieć się
Mapy Google - domyślny zestaw sterowania jest ustawiona:,Mapy Google - bardziej zestaw sterujący,Mapy Google - Wyłącz domyślny zestaw kontrolny,Przykłady,Mapy Google - wszystkie regulatory ustawione, aby otworzyć,Przykłady,Mapy Google - zmodyfikować zestaw kontrolny,Przykłady,Przykłady,Przykłady,Mapy Google - set kontroli niestandardowych,Przykłady,Mapy Google - zestaw kontrolny Reference Manual,
Google Maps kontroli wymienione
Google Map - domyślny zestaw sterowania jest ustawiona:
Mapy Google - domyślny zestaw sterowania jest ustawiona:
Przy użyciu standardowego mapa Google, jego ustawienia domyślne są następujące:
- .Zoom- Wyświetla suwak do kontrolowania poziomu powiększenia mapy
- .PPan- Na ekranie mapy jest płaski kontrole miska podobny, kliknij na czterech rogach przesuwać mapę
- .MapType- Pozwala użytkownikowi na wybór pomiędzy różnymi rodzajami map (mapy drogowej i satallite) Przełącznik
- .StreetView- Pojawia się jako ikona Pegmana, można przeciągnąć je do punktu na mapie, aby otworzyć Street View
Mapy Google - bardziej zestaw sterujący
Oprócz wyżej domyślny zestaw sterowania pomocną także:
- .Scale- Wyświetlania mapy Skala
- .Rotate- Wyświetla mały obwód ikonę, można obrócić mapę
- .verview Mapa- w widoku z perspektywy mapy rozległej
Podczas tworzenia mapy można określić zestaw sterowania jest wyświetlany przez ustawienie opcji lub dzwoniąc setOptions (), aby zmienić mapę opcje ustawień.
Mapy Google - Wyłącz domyślny zestaw kontrolny
Możesz wyłączyć domyślny zestaw kontroli.
Aby wyłączyć domyślny zestaw kontrolny, należy ustawić właściwość mapować disableDefaultUI prawdziwe:
Mapy Google - wszystkie regulatory ustawione, aby otworzyć
Niektóre kontrole ustawić wyświetlanie domyślnej na mapie, podczas gdy inne nie będzie, chyba że je ustawić.
Ustaw regulator aby był on widoczny prawda - Ustaw regulator na false, aby ją ukryć.
Poniższe przykłady są otwarte wszystkie kontrole:
Przykłady
panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true
Spróbuj »
Mapy Google - zmodyfikować zestaw kontrolny
Niektóre kontrole mapy są konfigurowalne. Zmiana kontroli określonych przez rozwijanie pola opcji sterowania.
F Na przykład, aby zmienić opcję sterowania zoomem określa zoomControlOptions. zoomControlOptions zawiera trzy następujące opcje:
- .google.maps.ZoomControlStyle.SMALL- wyświetlacz zminimalizować kontrolę zoomu
- .google.maps.ZoomControlStyle.LARGE- zoom standardowy pokaz slajdów kontrole
- .google.maps.ZoomControlStyle.DEFAULT- wyposażenie i wielkość mapowych, wybrać najbardziej odpowiednią kontrolę
Przykłady
zoomControl : true ,
zoomControlOptions :
{
style : google . maps . ZoomControlStyle . SMALL
}
Spróbuj » Uwaga: Jeśli chceszzmodyfikować kontrolę, najpierw kontrolę obrotu (ustaw ją na true).
Kolejna kontrola to kontrola MapType.
może pojawić MapType kontrola w jednej z następujących opcji w stylu:
- google.maps.MapTypeControlStyle.HORIZONTAL_BAR, w poziomym pasku pojawi się jako zestaw przycisków sterujących, jak pokazano w Mapach Google.
- google.maps.MapTypeControlStyle.DROPDOWN_MENU, do wyświetlania pojedynczego przycisku sterowania, dzięki czemu można wybrać typ mapy z menu rozwijanego.
- google.maps.MapTypeControlStyle.DEFAULT, do wyświetlania "default" zachowanie, która zależy od wielkości ekranu i mogą ulec zmianie w przyszłych wersjach API.
Przykłady
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU
}
Spróbuj » Podobnie, można użyć właściwości location ControlPosition określoną kontrolę:
Przykłady
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position:google.maps.ControlPosition.TOP_CENTER
}
Spróbuj »
Mapy Google - set kontroli niestandardowych
Tworzenie niestandardowego formantu, aby powrócić do Londynu na imprezę kliknij: (Jeśli mapa jest przeciągany):
Przykłady
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);
Spróbuj »
Mapy Google - zestaw kontrolny Reference Manual
Google Maps API Reference ręczne .