Come posso visualizzare le posizioni di scansione in una mappa?

Visualizza su una mappa i luoghi in cui sono stati scansionati i vostri codici QR

book reader icon
3 Minuti
facebook logo gray
linkedin logo gray
mail logo gray

Invio di posizioni di scansione con GPS

Quando attivate la funzione di tracciamento GPS dei vostri codici QR, alle persone che li scansionano viene chiesto se vogliono inviare la loro posizione GPS. Se l'utente consente l'invio della propria posizione, viene memorizzato un valore lng/lat che può essere utilizzato per visualizzare la posizione della scansione su una mappa. Il seguente tutorial spiega come utilizzare il nostro widget QR Map per incorporarlo nel vostro sito web e mostrare le posizioni di scansione dei vostri utenti.

Precondizioni

Per incorporare una mappa sul proprio sito web sono necessari un account attivo, una chiave API valida e una chiave API di Google Maps. Si prega di impostare la chiave API di Google Maps nelle impostazioni utente o nella sezione branding del proprio account in modo che la mappa possa essere resa.

Come creare una mappa che mostri le posizioni di scansione dei codici QR

1. Aggiungi lo script alla tua pagina

Inserite il seguente script con il vostro sottodominio e la chiave API nella vostra pagina web. Attenzione: Utilizzare la chiave API del proprio account e NON la chiave API di Google Maps.

<script>
    type="text/javascript".
    src="//YOUR_SUBDOMAIN.qrplanet.com/widgets/tagmap.js?apikey=***************">
</script>

2. Creare un livello div in cui incorporare la mappa

Posizionare il <div> nella pagina, dove la mappa deve essere visualizzata:

<div style="width:100%;height:500px;" id="map_canvas"></div>

3. Aggiungi parametri di visualizzazione opzionali

  • il parametro lng / lat centra la mappa sulla posizione data
  • zoom - Centra la mappa a un determinato livello di zoom (min=1 | max=12)
  • showlabels - Se si imposta a 0, non viene visualizzata alcuna etichetta su un pin quando si passa il mouse.
  • displayinfoonclick - Se si imposta a 0, non vengono visualizzate informazioni quando si fa clic sull'icona.
tagmap.js? ... &lng=16.3691234&lat=48.2055264&zoom=12

4. Visualizzare le posizioni di scansione

Se si desidera visualizzare dove è stato scansionato un singolo codice QR tracciabile con la funzione GPS attivata, è sufficiente aggiungere il parametro opzionale id nell'URL dello script e impostare il valore su un id di uno dei codici QR creati. L'id di un codice QR è l'URL abbreviato (ad esempio, 7W). Invece di mostrare i codici QR geo-tagged assegnati a una posizione fissa, le posizioni di scansione di un singolo codice QR vengono mostrate sulla mappa.

tagmap.js? ... &id=7W

Se si desidera visualizzare più di un codice QR con posizioni GPS sulla mappa basta aggiungere più id separati da un +

tagmap.js? ... &id=7W+SECONDID+THIRDID+...+N_TH-ID

5. Impostare un intervallo di tempo per i tempi di scansione

È possibile regolare con precisione le statistiche aggiungendo un parametro di intervallo di tempo:

  • impostare un intervallo specifico dalla - alla data: ad esempio &from=2024-02-24&to=2024-02-24
  • o impostare un intervallo predefinito: oggi, ieri, ultimo7, ultimo31 ad esempio &range=oggi

6. Impostare un limite di scansioni per codice QR

È possibile limitare il numero di posizioni di scansione GPS visualizzate sulla mappa impostando il parametro limite per ciascun codice QR separato da un +.

Se il limite è impostato su 1, verrà visualizzata l'ultima scansione del codice QR.

tagmap.js? ... &limit=3+2+10

7. Stilizzate la vostra mappa QR

Invece di utilizzare le icone dei codici QR predefinite, è possibile utilizzare un simbolo/icona personalizzato. Impostare sempre l'URL assoluto come parametro opzionale icon

tagmap.js? ... &icon=https://qr.domain.com/img/littleone.png

Se si visualizzano più codici QR (=passando più di un id al parametro id), è possibile impostare un'icona diversa per ogni codice QR aggiungendo più URL di icone separate da un +

tagmap.js? ... &icon=https://qr.domain.com/img/littleone.png+
http://icon.com/img/anotherone.png

8. Disegna un percorso sulla mappa tra le posizioni di scansione

Con il parametro opzionale disegna percorso impostato su true, verrà disegnato un percorso tra le posizioni scansionate del Codice QR.

tagmap.js? ... &drawpath=true

Debugging

La mappa non viene visualizzata

Aprire la console degli errori dal browser. La console mostra ulteriori informazioni sull'errore.

Se la mappa non viene visualizzata sul vostro sito web, ciò potrebbe verificarsi perché Goolge richiede una chiave API. Assicuratevi prima di tutto di aver implementato il widget come descritto sopra.

Se il vostro browser visualizza un messaggio di avviso da parte di Google come quello mostrato di seguito, procuratevi una chiave API di Google e aggiungetela alle impostazioni dell'utente
Avviso API di Google Maps: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys

Data privacy

La posizione GPS viene mostrata sulla mappa solo quando l'utente ha approvato la geolocalizzazione o la posizione viene recuperata tramite IP e il IP Anonymization è diverso da "Non memorizzare affatto i visitatori unici".

QR Map Widget Demo

Vedete il TagMap Widget in azione che mostra le posizioni di scansione dei codici QR inviati tramite GPS.

Last update 4 months ago