Cos'è un generatore Google map?

Il generatore di mappe Google mostra come personalizzare la tua mappa di Google e la rappresentazione visiva di elementi come strade, parchi ed edifici. Usa lo strumento guidato per lo styling di Google Map. Genera il codice javascript e intergalo nella tua pagina web.

Generatore di mappe Google

Scegli un tema per la mappa dalla nostra raccolta oppure crea la tua Google map personalizzandone lo stile.

Personalizza la mappa con la tua creatività, con impostazioni, stili, visibilità, peso, etichette e colori per tutte le tipologie di caratteristiche della mappa.

Costruttori e generatori Google

5 Condividi

Imposta mappa e controlli

Scrivi un indirizzo o trascina il marker sulla mappa

Latitudine

Longitudine

Tipo di mappa

Zoom

Tutti i controlli

Controllo di Zoom

Indicatore di scala

Controllo Street view

Rotazione

Full screen

Reset

Scegli un tema

Default

Silver

Night mode

Retro

Hide features

Black

Aubergine

Grey light

Facebook

Dark

Clinique

Indigo

Beige

Pale down

Turquoise

Bright

Crea la tua mappa personalizzata

Seleziona proprietà

Saturazione

Luminosità

Visibilità

Spessore

Colore

Etichetta

Reset

RESET GENERA CODICE MAPPA

Google Map

L'API JavaScript di Google Maps ti consente di personalizzare le mappe con i tuoi contenuti, stili e colori per la visualizzazione su pagine web e dispositivi mobili.

L'API JavaScript di Google Maps offre quattro tipi di mappe di base (stradale, satellitare, ibrida e terreno) che puoi personalizzare con diversi livelli, stili, controlli, eventi, servizi e librerie.

Il codice ottenuto con il generatore di mappe Google potrebbe cambiare ogni volta che Google aggiorna lo stile della mappa di base. Usare con cautela.

Per cominciare...

Il modo più semplice per acquisire familiarità con l'API JavaScript di Google Maps è vedere un semplice esempio.

Il codice seguente mostra la mappa del centro di Roma:

<html>
  <head>
    <title>Semplice Mappa by seochecker</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
  </head>
  <body>
    <div id="my_seochecker_map"></div>
    <script>
      var map;
        function seochecker_map() {
          map = new google.maps.Map(document.getElementById('my_seochecker_map'), {
            center: {lat:41.923741, lng:12.494129},
            zoom: 8
          });
        }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=[YOUR_API_KEY]&callback=seochecker_map" async defer></script>
  </body>
</html>

Per utilizzare l'API JavaScript di Maps, devi ottenere una chiave API che puoi quindi aggiungere all'app mobile, al sito Web o al server Web.

L'API key viene utilizzato per tenere traccia delle richieste API associate al tuo progetto.

I componenti del generatore Google map

Scopriamo tutti i parametri

La tabella seguente fornisce una spiegazione e un esempio di ciascuno dei componenti. Per saperne di più, controlla i link nella sezione risorse correlate a fondo pagina.

Indirizzo	È solo un prerequisito per fornire le coordinate di latitudine e longitudine per centrare la mappa.
Latitudine e Longitudine `Obbligatorio`	Fornisce le coordinate per centrare la mappa. center: {lat:41.933495, lng:12.579144}
Zoom `Obbligatorio`	Indica il livello di zoom della mappa. zoom: 12
Tipo di mappa	Esistono 4 tipologie di mappe disponibili con le API Javascript Googe Map.. stradale: mappa stradale predefinita; satellitare: mostra le immagini satellitari Google Earth; ibrida: mostra un mix tra mappa stradale e satellitare; terreno: visualizza una mappa fisica basata sulle informazioni sul terreno. mapTypeId: "roadmap"
Controlli	Di seguito è riportato un elenco del set completo di controlli che puoi utilizzare nelle tue mappe: Controllo di Zoom mostra i comandi "+" e "-" per cambiare il livello di zoom sulla mappa. Il Controllo tipo di mappa è dispobibile in un menù a tendina, consente all'utente di cambiare il tipo di visualizzazione (stradale/ROADMAP, satellitare/SATELLITE, ibrida/HYBRID, o terreno/TERRAIN). Il Controllo Street View mostra l'icona "Pegman" che può essere trascinata sulla mappa per attivare Street View. La Rotazione fornisce una combinazione di opzioni di inclinazione e rotazione per mappe contenenti immagini oblique. Per maggiori informazioni visita immagini a 45°. Il Controllo di scala mostra la scala di visualizzazione della mappa. Attivato di default. Il Controllo Fullscreen offre la possibilità di aprire la mappa in modalità fullscreen. N.B.: iOS non supporta la funzione a schermo intero. Il controllo a schermo intero non è quindi visibile sui dispositivi iOS. mapTypeControl:true Puoi anche disattivare completamente le impostazioni predefinite di mappa. Per fare ciò, imposta la proprietà disableDefaultUI della mappa (all'interno dell'oggetto MapOptions) sul valore "true". disableDefaultUI: true
Temi	Questo builder fornisce diverse combinazioni di temi per Google Maps. Utilizzando un tema, puoi personalizzare la rappresentazione della mappe Google, modificando la visualizzazione di elementi come strade, parchi e aree edificate.. Ci sono 2 modi per applicare stili alla mappa: Imposta la proprietà .styles dell'oggetto MapOptions di Google Map. Questo approccio cambia lo stile del tipo di mappa stradale (non satellitare nè terreno). Crea un StyledMapType e applicalo alla mappa. Questo crea un nuovo tipo di mappa, che l'utente può selezionare dal controllo del tipo di mappa. styles: [ {elementType: 'geometry', stylers: [{color: '#242f3e'}]}, {elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]}, {elementType: 'labels.text.fill', stylers: [{color: '#746855'}]}, { featureType: 'administrative.locality', elementType: 'labels.text.fill', stylers: [{color: '#d59563'}] } ]
Proprietà di mappa	Le mappe con stili personalizzati utilizzano due concetti per applicare colori e altre impostazioni di stile ad una mappa: Funzionalità e selettori indicano i componenti geografici a cui puoi applicare uno stile personalizzato. Questi selettori includono strade, parchi, specchi d'acqua e altro, nonché le loro etichette. I selettori includono funzionalità ed elementi, specificati come proprietà featureType e elementType. Gli Styler sono invece proprietà quali colore e visibilità che puoi applicare agli elementi della mappa. Definiscono il colore visualizzato attraverso una combinazione di valori di tonalità, colore e luminosità/gamma. Proprietà Tutte le proprietà Confini Paesi Province Località Quartieri Terreni Paesaggio Artificiale Naturale Suolo Terreno Punti di interesse Attrazioni Attività Sedi governative Sanità Parchi Luoghi di lavoro Scuole Complessi sportivi Strade Autostrade Caselli Arterie Strade locali Trasporti Linee Stazioni Aereoporti Autobus Ferrovie Mari e laghi Elementi: Tutti Geometrici Riempimento Spessore Etichette Testo Riempimento del testo Outline del testo Icone Stili: Visibilità Default Nascosta Semplificata Visibile Colore Spessore Saturazione Luminosità