Google Map Overlay

L'aggiunta di un marcatore in Google Maps

Google Maps - Sovrapposizioni

Le sovrapposizioni sono oggetti legati alla latitudine / longitudine coordinate sulla mappa, trascinare o ingrandire la mappa si sposterà con voi.

API di Google Maps sono le seguenti sovrapposizioni:

Punto utilizzando icone sulla mappa per mostrare la spesso visualizzare un'icona personalizzata. I marcatori sono oggetti tipo GMarker, e possono essere utilizzati per personalizzare i tipi di oggetti Gicon icona.
Le linee sulla mappa utilizzando polilinee (che rappresentano un insieme di punti) da visualizzare. Linea GPolyline del tipo di oggetto.
Le aree sulla mappa viene visualizzata come poligoni (se la zona è una forma arbitraria) o sovrapposizione di fondo (se si tratta di un'area rettangolare). Poligono simile ad una polilinea chiusa, può essere di qualsiasi forma. sovrapposizioni fissate al suolo sono comunemente usati per mappare l'area con piastrelle associati direttamente o indirettamente.
La mappa stessa viene visualizzato con una sovrapposizione di piastrelle. Se si possiede una serie di piastrelle, è possibile utilizzare la classe GTileLayerOverlay per cambiare le piastrelle esistenti sulla mappa, si può anche utilizzare GMapType per creare i propri tipi di mappa.
finestra delle informazioni è anche un tipo speciale di sovrapposizione. Si noti, tuttavia, la finestra di informazioni verrà automaticamente aggiunto alla mappa, e la mappa può aggiungere un solo tipo di oggetto GInfoWindow.

Google Maps - Aggiungi tag

Mappa identifica i punti sul disco. Per impostazione predefinita, usano G_DEFAULT_ICON (È inoltre possibile specificare un'icona personalizzata). GMarker costruttore GLatLng e GMarkerOptions (opzionale) oggetto come parametro.

Tag progettato per essere interattivo. Ad esempio, per impostazione predefinita, che ricevono "click" eventi, spesso usato per aprire la finestra con le informazioni nei listener di eventi.

Con setMap () per aggiungere i marcatori sulla mappa:

Esempi

var marker=new google.maps.Marker({
position:myCenter,
});

marker.setMap(map);

Prova »

Google Maps - marcatore trascinabili

L'esempio che segue descrive come utilizzare la proprietà di animazione per trascinare il marcatore:

Esempi

marker=new google.maps.Marker({
position:myCenter,
animation:google.maps.Animation.BOUNCE
});

marker.setMap(map);

Prova »

Google Maps - icona

Tag può essere definito dalla nuova icona viene visualizzata al posto dell'icona di default:

Esempi

var marker=new google.maps.Marker({
position:myCenter,
icon:'pinkball.png'
});

marker.setMap(map);

Prova »

Google Maps - polilinea

oggetto GPolyline in grado di creare una sovrapposizione lineare sulla mappa. GPolyline comprende una serie di punti e crea una serie di file ordinate collegano questi punti.

Polyline supporta i seguenti attributi:

Percorso - specificare più di una linea di latitudine / longitudine
strokeColor - specifica il valore esadecimale del colore della linea (formato: "#FFFFFF")
strokeOpacity - Trasparenza linea designato (il valore di 0,0 a 1,0)
strokeWeight - Definisce la larghezza della linea, espressa in pixel.
modificabile - se l'utente può modificare la definizione di una linea retta (vero / falso)

Esempi

var myTrip = [stavanger,amsterdam,london];
var flightPath = new google.maps.Polyline({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2
});

Prova »

Google Maps - Polygon

oggetti GPolygon sono oggetti GPolyline simili perché includono una serie di punti ordinati. Tuttavia, i poligoni sono due punti finali, ma il disegno dell'area anello chiuso è definito formazione.

E la linea, è possibile personalizzare il colore e la trasparenza del poligono bordi (linee) colore, spessore e trasparenza, nonché la chiusura dell'area riempita. I colori devono essere in formato esadecimale stile HTML numerico.

Poligono supporta i seguenti attributi:

Percorso - specificate molteplici coordinate di latitudine lineare (prima e l'ultima coordinate sono uguali)
strokeColor - specifica il valore esadecimale del colore della linea (formato: "#FFFFFF")
strokeOpacity - Trasparenza linea designato (il valore di 0,0 a 1,0)
strokeWeight - Definisce la larghezza della linea, espressa in pixel.
fillColor - valori di colore esadecimali area chiusa (formato: "#FFFFFF")
fillOpacity - Trasparenza specificare il colore di riempimento (che è 0,0 a 1,0)
modificabile - se l'utente può modificare la definizione di una linea retta (vero / falso)

Esempi

var myTrip = [stavanger,amsterdam,london,stavanger];
var flightPath = new google.maps.Polygon({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});

Prova »

Google Maps - rotonde

Turno supporta i seguenti attributi:

Centro - il punto centrale dei parametri cerchio specificato google.maps.LatLng
Raggio - specifica il raggio del cerchio, in metri
strokeColor - Specifica i valori di colore arco esadecimale (formato: "#FFFFFF")
strokeOpacity - Trasparenza arco designato (il valore 0,0 a 1,0)
strokeWeight - Definisce la larghezza della linea, espressa in pixel.
fillColor - specifica il valore esadecimale del colore del valore cerchio di riempimento (formato: "#FFFFFF")
fillOpacity - Trasparenza specificare il colore di riempimento (che è 0,0 a 1,0)
Definisce se l'utente può modificare una linea retta (vero / falso)

Esempi

var myCity = new google.maps.Circle({
center:amsterdam,
radius:20000,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});

Prova »