O hartă Google - cu setul de control prestabilit:
Hărți Google - Controale implicite
Când se afișează o hartă Google standard vine cu setul de control prestabilit:
- Zoom - afișează un cursor sau "+/-" butoane pentru a controla nivelul de zoom al hărții
- Pan - afișează un control pan pentru panoramare hărții
- Maptype - permite utilizatorului de comutare între tipuri de hărți (roadmap and satellite) de (roadmap and satellite)
- Street View - afișează o pictogramă Pegman care poate fi tras la harta pentru a permite Street View
Hărți Google - Mai multe controale pentru
În plus față de controalele implicite, Google Maps are, de asemenea:
- Scale - afișează un element de hartă la scară
- Rotire - afișează o pictogramă mică circulară care vă permite să se rotească hărți
- Privire de ansamblu Hartă - afișează o hartă generală în miniatură care reflectă viewport de hartă într-o zonă mai largă
Puteți specifica care controlează pentru a arăta la crearea hărții (inside MapOptions) în setOptions() (inside MapOptions) sau prin apelarea setOptions() pentru a schimba opțiunile de pe hartă.
Hărți Google - Dezactivarea Controalele implicite
în schimb, vă recomandăm să dezactivați controalele implicite.
Pentru a face acest lucru, setați proprietatea hărții disableDefaultUI (în Opțiuni hartă obiect) la true:
Hărți Google - Activare toate controalele
Unele controale apar pe hartă în mod implicit; în timp ce altele nu vor apărea dacă nu le setați.
Adăugarea sau eliminarea controalelor de pe hartă este specificat în foaia de opoziție opțiuni.
Setați controlul la true pentru a face vizibil - Setați controlul la fals să-l ascundă.
Următorul exemplu se transformă "on" toate controalele:
Exemplu
panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true
Încearcă - l singur » Hărți Google - Controale Modificarea
Mai multe dintre comenzile harta sunt configurabile.
Controalele pot fi modificate prin specificarea câmpurilor opțiuni de control.
De exemplu, opțiunile pentru modificarea unui control zoom sunt specificate în câmpul zoomControlOptions. Câmpul zoomControlOptions poate conține:
- google.maps.ZoomControlStyle.SMALL - afișează un control mini-zoom (doar + și - butoane)
- google.maps.ZoomControlStyle.LARGE - afișează standardul cursorului de zoom
- google.maps.ZoomControlStyle.DEFAULT - alege cel mai bun control zoom bazat pe dispozitiv și dimensiunea hărții
Exemplu
zoomControl:true,
zoomControlOptions: {
style:google.maps.ZoomControlStyle.SMALL
}
Încearcă - l singur » Note: Dacă modificați un control, activați întotdeauna controlul primului (set it to true) .
Un alt control al configurabil este controlul maptype.
Opțiuni pentru modificarea unui control sunt specificate în câmpul mapTypeControlOptions. Câmpul mapTypeControlOptions poate conține ::
- google.maps.MapTypeControlStyle.HORIZONTAL_BAR - un singur buton de afișare pentru fiecare tip de hartă
- google.maps.MapTypeControlStyle.DROPDOWN_MENU - selectați tip de hartă prin intermediul unui meniu drop-down
- google.maps.MapTypeControlStyle.DEFAULT - afișează "default" comportamentul (depends on screen size)
Exemplu
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU
}
Încearcă - l singur » Puteți poziționa, de asemenea, un control, cu proprietatea ControlPosition:
Exemplu
mapTypeControl:true,
mapTypeControlOptions: {
style:google.maps.MapTypeControlStyle.DROPDOWN_MENU,
position:google.maps.ControlPosition.TOP_CENTER
}
Încearcă - l singur » Hărți Google - comenzi personalizate
Creați un control personalizat care te duce întotdeauna înapoi la Londra, când faceți clic (if the map is dragged) în (if the map is dragged) care (if the map is dragged) :
Exemplu
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);
Încearcă - l singur » Hărți Google - Controale de referință
Google Maps API - ul de referință .