Ridimensiona icona icona indicatore di Google Maps immagine

Question

Quando carico un'immagine nella proprietà dell'icona di un marcatore visualizzata con la sua dimensione originale, che è molto più grande di quanto dovrebbe essere.

Voglio ridimensionare lo standard ad una dimensione più piccola. Qual è il modo migliore per farlo?

Codice:

function addMyPos(latitude,longitude){ 
    position = new google.maps.LatLng(latitude,longitude) 
    marker = new google.maps.Marker({ 
    position: position, 
    map: map, 
    icon: "../res/sit_marron.png" 
    }); 
} 

Answer 1

Se il formato originale è di 100 x 100 e si vuole scalare a 50 x 50, utilizzare scaledSize al posto di Taglia.

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(50, 50), // scaled size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(0, 0) // anchor 
}; 

var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(lat, lng), 
    map: map, 
    icon: icon 
}); 

Answer 2

Come citato nei commenti, questa è la soluzione aggiornata a favore di oggetto Icon con la documentazione.

Usa Icon object

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(50, 50), // scaled size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(0, 0) // anchor 
}; 

posicion = new google.maps.LatLng(latitud,longitud) 
marker = new google.maps.Marker({ 
    position: posicion, 
    map: map, 
    icon: icon 
}); 

Answer 3

MarkerImage has been deprecated for Icon

Fino alla versione 3.10 delle API di Google Maps JavaScript, icone complesse sono stati definiti come oggetti MarkerImage. L'oggetto letterale Icon è stato aggiunto in 3.10 e sostituisce MarkerImage dalla versione 3.11 in poi. Le icone letterali supportano gli stessi parametri di MarkerImage, consentendo a di convertire facilmente un MarkerImage in un'icona rimuovendo il costruttore , inserendo i parametri precedenti in {} e aggiungendo i nomi di ciascun parametro.

codice di Phillippe sarebbe ora essere:

var icon = { 
    url: "../res/sit_marron.png", // url 
    scaledSize: new google.maps.Size(width, height), // size 
    origin: new google.maps.Point(0,0), // origin 
    anchor: new google.maps.Point(anchor_left, anchor_top) // anchor 
}; 

position = new google.maps.LatLng(latitud,longitud) 
marker = new google.maps.Marker({ 
    position: position, 
    map: map, 
    icon: icon 
}); 

Answer 4

un principiante come me l'argomento può trovare più difficile implementare una di queste risposte che, se all'interno del vostro controllo, per ridimensionare l'immagine da soli con un editor online o un editor di foto come Photoshop.

Un'immagine 500x500 apparirà più grande sulla mappa di un'immagine 50x50.

Nessuna programmazione richiesta.

Answer 5

origine Elimina e ancora sarà più immagine regolare

var icon = { 
     url: "image path", // url 
     scaledSize: new google.maps.Size(50, 50), // size 
    }; 

marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(lat, long), 
    map: map, 
    icon: icon 
});