Guinguette Marais Poitevin

Questa pagina mostra come personalizzare la tua mappa e cambiare la visualizzazione di elementi come strade, parchi ed edifici. Personalizza la tua mappa usando i seguenti strumenti:

• Strumenti basati su cloud (Beta): Usa Google Cloud Console per creare e gestire gli stili delle mappe e collegarli alle tue mappe usando gli ID delle mappe. Puoi creare nuovi stili usando lo strumento di styling o importare definizioni di stile esistenti. Ogni volta che aggiorni uno stile, la tua pagina web sarà automaticamente aggiornata con i cambiamenti.

• Dichiarazioni di stile JSON: Per ogni cambiamento di personalizzazione della tua mappa, usa le dichiarazioni di stile JSON incorporate per definire manualmente gli stili della mappa. Cambiare queste dichiarazioni di stile richiede l’aggiornamento del codice lato client che utilizza il dispositivo dell’utente finale per eseguire le operazioni e aggiornare la tua pagina web.

Utilizzare gli strumenti basati sul cloud (Beta)

Le seguenti istruzioni mostrano come utilizzare la Google Cloud Console per creare, personalizzare, pubblicare e gestire le tue mappe in qualsiasi momento utilizzando gli ID mappa e gli stili mappa.

Per creare o gestire qualsiasi Map ID o Map Styles nel tuo progetto Google Cloud, devi avere il ruolo IAM di Project Owner o Project Editor.

Creazione di Map ID

Un Map ID è un identificatore unico che rappresenta una singola istanza di una GoogleMap. È possibile creare ID mappa e aggiornare uno stile associato a un ID mappa in qualsiasi momento nella Google Cloud Console senza modificare lo stile JSON incorporato nel codice dell’applicazione.

Per creare un ID mappa:

1. Nella Cloud Console, vai alla pagina Gestione mappe.

   Vai alla pagina di gestione delle mappe

2. Clicca su Create New Map ID, per visualizzare il modulo Create New Map ID.

   

   Nel modulo, fai quanto segue:

   • Specifica il nome della mappa.
   • Specifica il tipo di mappa o la piattaforma.
   • Inserisci una descrizione della mappa.
   • Fai clic su Avanti per visualizzare il nuovo ID della mappa.

Utilizzare i Map ID nel tuo codice applicativo

Per creare una mappa con un Map ID nel tuo codice applicativo:

Creazione di Map Styles

Un Map Style è un identificatore unico per un insieme di personalizzazioni che può essere associato a qualsiasi Map ID.

Per creare un nuovo stile:

1. Nella Google Cloud Console, vai alla pagina Map Styles.

   Vai a Map Styles

2. Clicca Create New Map Style per aprire la pagina New Map Style.

3. Nella pagina Nuovo stile di mappa, puoi:

   • Personalizzare la visualizzazione di diverse caratteristiche della mappa:

     1. Selezionare uno stile di mappa da una delle varianti di stile disponibili;In alternativa, importare il codice di stile JSON incollando il tuo codice JSON nella casella di testo nella scheda Carica JSON.

     2. Aprire l’Editor di stile cliccando su Personalizza nell’Editor di stile.

        Nell’Editor di stile, puoi:

        • Cambiare lo stile delle caratteristiche su una mappa, come strade, corpi d’acqua e corridoi commerciali.
        • Filtrare i punti di interesse a specifici tipi di attività.
        • Specificare la visualizzazione della densità dei punti di interesse.

   • Oppure, selezionare uno stile di mappa personalizzato per enfatizzare gli obiettivi di un settore specifico.

4. Per dare un nome allo stile di mappa e salvare le modifiche, fare clic su Salva.

Aggiornamento dei dettagli dello stile

Nella pagina Stili di mappa, è possibile selezionare uno stile di mappa per completare le seguenti azioni:

• Continuare la personalizzazione o visualizzare i dettagli dello stile nell’Editor di stile cliccando suPersonalizza stile.

  Nell’Editor di stili, se si associa un ID mappa al proprio stile mappa, salvando e pubblicando si rendono pubbliche le modifiche allo stile per le mappe associate. Salvare le personalizzazioni dello stile senza pubblicare nell’Editor stili non renderà le modifiche pubblicamente visibili.

• Rinomina o modifica una descrizione per lo stile cliccando su Modifica.

• Duplica lo stile cliccando su Duplica.

• Elimina lo stile cliccando su Elimina.

• Visualizza gli ID mappa associati allo stile.

Gli stili creati prima del 15 settembre 2020 non visualizzeranno le caratteristiche naturali migliorate di Google Maps. Per utilizzare il supporto di Google Maps enhanced natural features per il tuo stile di mappa, devi creare un Map Style.

Personalizzazione a diversi livelli di zoom

Puoi personalizzare lo stile degli elementi esistenti a diversi livelli di zoom quando crei stili di mappa con l’editor di stili in Google Cloud Console.

Per esempio, puoi personalizzare il colore dell’acqua dal rosa al livello di zoom 0 al viola al livello di zoom 10, e associare altre personalizzazioni al livello di dettaglio che vedi allo zoom specificato. Per provare questa funzione in un’applicazione di esempio, vedi Map ID with styling.

Per fare personalizzazioni di stile a diversi livelli di zoom:

1. Aprire l’editor di stili in Cloud Console. Per farlo, visita la pagina Stili di mappa e crea uno stile di mappa o aggiorna uno stile di mappa esistente.
2. Seleziona una caratteristica nel sottomenu Tipo di caratteristica per aprire il sottomenu Tipo di elemento e seleziona un elemento che vorresti personalizzare.

3. Seleziona la casella di controllo Personalizza attraverso gli zoom per far apparire le personalizzazioni al livello di zoom corrente nell’editor di stile.

   Una volta selezionata la casella di controllo Personalizza tra gli zoom, dovresti vedere quanto segue:

   • Una casella di controllo Aggiungi stop: z che indica il livello di zoom corrente e attacca le personalizzazioni al livello di zoom indicato.
   • Una barra di scorrimento dello zoom per modificare e selezionare il livello di zoom. Puoi regolare i livelli di zoom con i controlli booleani della mappa, la rotella del mouse o i tasti freccia della tua tastiera.

4. Quando fai delle personalizzazioni nel sottomenu Stylers, l’editor di stile seleziona automaticamente la casella di controllo Add stop: z, mostra un punto blu sopra il cursore e sovrascrive qualsiasi stile ereditato.

   Il punto blu sopra il tuo cursore indica che le modifiche sono state fatte al livello di zoom selezionato. Per evitare che le modifiche vengano salvate ad un particolare livello di zoom, deselezionare la casella di controllo Add stop: z (il punto blu diventa grigio per indicare che le modifiche non verranno salvate a quel livello). Dopo aver deselezionato la casella di controllo, l’elemento ritorna al suo stile ereditato.

   Qualsiasi personalizzazione fatta a un livello di zoom aggiornerà le personalizzazioni ai livelli di zoom indicati e superiori. Per esempio, le personalizzazioni al livello di zoom 10 influenzano tutte le personalizzazioni ai livelli di zoom 10, 11, 12 e così via.Le personalizzazioni sovrascrivono qualsiasi stile ereditato.

5. Per salvare le modifiche, clicca su Salva. Per rendere le modifiche pubbliche sugli ID delle mappe associate al tuo stile di mappa, clicca su Publish.

Utilizzando le dichiarazioni di stile JSON incorporate

Puoi applicare uno stile personalizzato attraverso una dichiarazione di stile JSON incorporata a quanto segue:

• Mappa di default.
• Tipi di mappa tra cui l’utente può passare all’interno di un singolo frame di mappa.

Specificare gli stili alle caratteristiche

Per applicare stili alle diverse caratteristiche ed elementi in una mappa, creare un array diMapTypeStyleoggetti che definiscono come la mappa dovrebbe essere stilizzata.

L’array ha la seguente forma:

Per una lista di tutti i valori disponibili per featureTypeelementType, estylers, vedere il riferimento agli stili JSON.

Maps Platform Styling Wizard

Utilizza il Maps Platform Styling Wizard come un modo veloce per generare un oggetto di stile JSON.

Applicazione di stili a una mappa predefinita

Quello che segue mostra un esempio di mappa predefinita stilizzata usando testo e icone chiare su uno sfondo scuro (cioè in modalità dark). Per vedere l’esempio di codice, vai aStyled Maps – Night Mode code sample.

Per modificare gli stili della mappa predefinita, impostate la proprietà styles della mappa nell’oggettoMapOptions al vostro array di stili quando:

• crea la tua mappa.
• Oppure, quando si chiama il metodo Map.setOptions.

Le modifiche alle etichette e alle strade hanno effetto su tutti i tipi di mappa, compresi i tipi di terreno, satellite, ibrido e mappa stradale predefinita.

Applica gli stili a un tipo di mappa

Quello che segue mostra un tipo di mappa aggiunto chiamato Styled Map nel controllo in alto a sinistra della mappa. Per vedere l’esempio di codice, vai a Styled Map Types.

Per creare un tipo di mappa stilizzato, imposta l’array di stili su un oggetto StyledMapType. La creazione di un nuovo tipo di mappa con stile non influisce sullo stile dei tipi di mappa predefiniti.

• Impara come usare le mappe vettoriali con lo stile delle mappe basato su Cloud.
• Impara come personalizzare il comportamento dei punti di interesse usando lo stile delle mappe basato su Cloud.
• Per evitare che aziende, punti di interesse e altre caratteristiche appaiano su una mappa usando una dichiarazione di stile JSON incorporata, vedi l’esempio di codiceHiding Map Features with Styling.
• Crea una legenda personalizzata usando dichiarazioni di stile JSON incorporate.