Bir Google harita - Varsayılan kontrol kümesiyle:
Google Haritalar - Standart Kontroller
Standart bir Google haritasını gösteren, varsayılan kontrol kümesiyle gelir:
- Yakınlaştırma - Bir kaydırıcı veya görüntüler "+/-" Haritanın yakınlaştırma düzeyini kontrol düğmeleri
- Pan - harita kaydırma için pan kontrol görüntüler
- MapType - harita türleri arasında kullanıcı geçiş düğmesini sağlar (roadmap and satellite)
- Sokak Görünümü - Sokak Görünümü etkinleştirmek için haritaya sürüklenebilir bir Pegman'i simge görüntüler
Google Haritalar - Diğer Denetimler
Varsayılan kontrollerine ek olarak, Google Maps de vardır:
- Ölçek - Bir harita ölçeği elemanı görüntüler
- Döndür - haritaları döndürmek sağlayan küçük dairesel simge görüntüler
- Dünya Haritası - Daha geniş bir alan içinde Mevcut harita görünümünü yansıtan küçük resim bakış harita görüntüler
Sen haritayı oluştururken göstermek için kontrol belirtebilirsiniz (inside MapOptions) ya da arayarak setOptions() haritanın seçenekleri değiştirmek için.
Google Haritalar - Standart Kontroller devre dışı bırakma
Bunun yerine varsayılan denetimleri kapatmak isteyebilirsiniz.
Bunu yapmak için, true (Harita seçenekleri nesne içinde) Haritalar'ın disableDefaultUI özelliğini ayarlayın:
Google Haritalar - Tüm Kontroller Aç
Bazı kontroller varsayılan olarak harita üzerinde görünür Eğer bunları sürece başkaları görünmez olurken.
haritadan ekleme veya çıkarma kontroller seçenekleri nesne Harita belirtilir.
gizlemek için false kontrolünü ayarlayın - görünür hale getirmek için true kontrolünü ayarlayın.
Aşağıdaki örnek döner "on" tüm kontroller:
Örnek
panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true Kendin dene " Google Haritalar - değiştirme Kontroller
Harita kontrollerinin birkaç yapılandırılabilir.
kontrolleri kontrol seçenekleri alanları belirtilerek değiştirilebilir.
Örneğin, bir Zoom kontrolü değiştirmek için seçenekler zoomControlOptions alanında belirtilir. zoomControlOptions alan içerebilir:
- google.maps.ZoomControlStyle.SMALL - mini yakınlaştırma denetimini görüntüler (sadece + ve - düğmeleri)
- google.maps.ZoomControlStyle.LARGE - standart zoom kaydırıcı denetimini görüntüler
- google.maps.ZoomControlStyle.DEFAULT - Cihazın ve harita boyutuna göre en iyi zoom kontrolünü alır
Örnek
zoomControl:true,
zoomControlOptions: {
style:google.maps.ZoomControlStyle.SMALL
}
Kendin dene " Note: Eğer bir denetimi değiştirirseniz, her zaman ilk denetimini etkinleştirmek (set it to true) .
Başka bir Programlanabilir kontrol MapType kontrolüdür.
bir denetimi değiştirmek için seçenekler mapTypeControlOptions alanında belirtilir. mapTypeControlOptions alan içerebilir ::
- google.maps.MapTypeControlStyle.HORIZONTAL_BAR - Her harita türü için gösterge tek düğmeyle
- google.maps.MapTypeControlStyle.DROPDOWN_MENU - Bir açılan menüsü aracılığıyla seçin haritası tipi
- google.maps.MapTypeControlStyle.DEFAULT - görüntüler "default" davranışı (depends on screen size)
Örnek
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU
} Kendin dene " Ayrıca ControlPosition özelliğiyle, bir denetim konumlandırabilirsiniz:
Örnek
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position:google.maps.ControlPosition.TOP_CENTER
} Kendin dene " Google Haritalar - Özel Denetimler
Her zaman geri Londra'ya götüren özel bir denetim oluşturma, tıklandığında (if the map is dragged) :
Örnek
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); Kendin dene "