Visualizzatore di mappe JSON: mostra le coordinate di un JSON su una mappa

Cosa fa questo visualizzatore

Molti dati di posizione non arrivano mai come file GIS. Arrivano come JSON normale: la risposta di un'API meteo, un elenco di negozi da uno store locator, un'esportazione da un'app di consegne o un file che ti manda uno sviluppatore. Ogni record ha una latitudine e una longitudine da qualche parte, ma uno strumento di mappe che si aspetta GeoJSON non riesce a leggerlo, e aprirlo in un foglio di calcolo fa perdere la struttura annidata.

Questo visualizzatore legge quel JSON così com'è. Cerca in tutto il documento gli elenchi di record, trasforma gli oggetti annidati in nomi di campo come `location.lat` e riconosce i nomi comuni di latitudine e longitudine, oltre ai campi singoli che contengono entrambi i valori, come array `[lng, lat]` o testi `"lat, lng"`. Ogni record con coordinate valide compare sulla mappa. La barra laterale ti dice quanti record non avevano coordinate o avevano valori fuori dall'intervallo valido, e ti avvisa quando latitudine e longitudine sembrano scambiate.

L'ho creato per il momento in cui qualcuno ti manda un file JSON e chiede "dove sono questi?". Controlli i dati in pochi secondi, colori i punti secondo un campo qualsiasi, clicchi su un punto per leggere l'intero record e scarichi il risultato in GeoJSON per un GIS o in CSV per un foglio di calcolo. Il file viene letto nel tuo browser e non viene mai caricato.

Le forme di JSON che lo strumento capisce

Il JSON reale ha molte forme. Queste sono quelle che lo strumento legge senza alcuna impostazione. In ogni caso mostra l'elenco di record trovato, e puoi sceglierne un altro se il file ne ha più di uno.

[{ "name": "Berlin", "lat": 52.52, "lng": 13.405 }]

{ "data": { "cities": [{ "name": "Paris", "latitude": 48.8566, "longitude": 2.3522 }] } }

[{ "name": "Rome", "location": { "lat": 41.9028, "lon": 12.4964 } }]

[{ "id": 7, "coordinates": [2.1686, 41.3874] }]

[{ "stop": "Central", "latlng": "59.3293, 18.0686" }]

{ "BER": { "lat": 52.52, "lng": 13.405 }, "PAR": { "lat": 48.86, "lng": 2.35 } }

{"lat": 38.72, "lng": -9.14}
{"lat": 41.16, "lng": -8.63}

Vengono letti anche i numeri salvati come testo, come "52.52", e i numeri con la virgola decimale, come "52,52". Gli array dentro un record, come un elenco di tag, restano come testo JSON nel popup e nell'esportazione.

Quali nomi di campo vengono riconosciuti

Lo strumento confronta l'ultima parte di ogni nome di campo, quindi `lat`, `location.lat` e `data.geo.lat` valgono tutti. Maiuscole e minuscole non contano. Se nulla corrisponde, scegli tu i campi nel pannello Coordinates.

Latitudine

lat, latitude, lat_dd, y, ycoord, point_y, decimalLatitude, gps_lat, geo_lat e forme simili.

Longitudine

lng, lon, long, longitude, lon_dd, x, xcoord, point_x, decimalLongitude, gps_lon, geo_lng e forme simili.

Un campo con entrambi

Nomi che finiscono con coordinates, coords, position, latlng, lnglat, location, geo, point, center o gps, quando il valore è un array di due numeri o un testo "a, b".

Scelta tra i candidati

Ogni possibile coppia di latitudine e longitudine viene provata sui primi 300 record. Vince la coppia con più valori dentro ±90 e ±180, una coppia con lo stesso oggetto padre riceve un bonus, e x/y perdono i pareggi contro veri nomi lat/lng.

Ordine di una coppia

lnglat, lonlat e coordinates vogliono dire longitudine prima. latlng e latlon vogliono dire latitudine prima. Per altri nomi vince l'ordine con più valori validi. Se vanno bene entrambi, gli array si leggono come [lng, lat] e i testi come "lat, lng".

Dettagli tecnici

Ecco esattamente cosa accetta e cosa produce lo strumento.

Input

File .json, .jsonl e .ndjson fino a 50 MB, oppure JSON incollato nel riquadro Paste JSON.

Non per GeoJSON o TopoJSON

Se il file è già GeoJSON ("type": "FeatureCollection") o TopoJSON ("type": "Topology"), ricevi un messaggio che ti indirizza al Visualizzatore GeoJSON o al Visualizzatore TopoJSON di questo sito.

Elenchi di record

Array in cui almeno metà degli elementi sono oggetti, a qualsiasi profondità fino a 8 livelli, più gli oggetti i cui valori sono tutti record. Prima compaiono gli elenchi con coordinate, poi quelli più grandi.

Coordinate valide

Latitudine tra −90 e 90, longitudine tra −180 e 180, in gradi decimali (WGS84). I record fuori da questi intervalli vengono contati e non disegnati.

Avviso di scambio

Se un record è fuori intervallo ma sarebbe valido con latitudine e longitudine scambiate, lo strumento lo conta e propone un pulsante Swap.

Colore per campo

Qualsiasi campo con al massimo 10 valori diversi può colorare i punti, con legenda e conteggio per valore.

Prestazioni

I punti sono disegnati su un canvas, quindi decine di migliaia di record restano fluidi su un normale portatile.

Esportazione

GeoJSON con ogni campo come proprietà, oppure CSV con latitude e longitude come prime due colonne e i campi appiattiti dopo.

Privacy

Il file viene letto nel tuo browser. Solo le tile della mappa di base arrivano da internet.

Come mettere un JSON su una mappa, passo dopo passo

Ecco tutto il flusso con l'esempio incluso: 25 città europee dentro una risposta annidata in stile API, con le coordinate in un oggetto `location` e un record senza posizione.

1

Passo 1: Apri lo strumento

La mappa si apre con una mappa stradale di base. Usa Upload, Paste JSON o trascina un file sulla mappa. Qui ho cliccato su Sample Data.

2

Passo 2: Controlla cosa è stato trovato

Il pannello Records mostra l'elenco scelto (`data.cities`), quanti record sono sulla mappa e quanti non avevano coordinate. Nell'esempio un record ha `"location": null`, quindi ne compaiono 24 su 25.

3

Passo 3: Conferma i campi delle coordinate

Il pannello Coordinates mostra i campi trovati, qui `location.lat` e `location.lng`. Passa a "One field" per dati con un solo campo `[lng, lat]` o `"lat, lng"`, e usa Swap se i punti finiscono nel posto sbagliato.

4

Passo 4: Colora i punti secondo un campo

Scegli un campo in "Color by field". Qui `capital` divide le città in capitali e altre città, con legenda e conteggio per ogni valore.

5

Passo 5: Leggi un record

Clicca su qualsiasi punto per vedere le coordinate esatte e ogni campo del record, compresi i valori annidati e gli array.

6

Passo 6: Esporta

Scarica i punti in GeoJSON per QGIS, ArcGIS o una mappa web, oppure in CSV per Excel e Fogli Google.

Altri modi per portare dati JSON su una mappa

Questo visualizzatore è il modo più veloce per guardare un file JSON. Quando ti serve lo stesso lavoro dentro un flusso di lavoro, questi sono gli strumenti che uso.

Lo stesso lavoro in codice

Tutti e tre gli esempi leggono il file di esempio usato sopra, saltano il record senza posizione e tengono gli altri campi.

# Python: pandas flattens nested JSON, GeoPandas builds the points
import json
import pandas as pd
import geopandas as gpd

with open("cities.json") as f:
    data = json.load(f)

df = pd.json_normalize(data["data"]["cities"])   # columns: location.lat, location.lng
df = df.dropna(subset=["location.lat", "location.lng"])
gdf = gpd.GeoDataFrame(
    df, geometry=gpd.points_from_xy(df["location.lng"], df["location.lat"]), crs="EPSG:4326"
)
gdf.to_file("cities.geojson", driver="GeoJSON")

# jq on the command line: JSON records to a GeoJSON FeatureCollection
jq '{type: "FeatureCollection", features: [
      .data.cities[] | select(.location != null) | {
        type: "Feature",
        properties: del(.location),
        geometry: { type: "Point", coordinates: [.location.lng, .location.lat] }
      }]}' cities.json > cities.geojson

// JavaScript + Leaflet: note the order, Leaflet wants [lat, lng]
const res = await fetch("cities.json");
const json = await res.json();
for (const c of json.data.cities) {
  if (!c.location) continue;
  L.marker([c.location.lat, c.location.lng]).bindPopup(c.name).addTo(map);
}

Il mio parere: usa questo strumento per capire un JSON nuovo e controllarne le coordinate. Quando conosci la struttura, poche righe di Python o jq lo trasformano in GeoJSON ogni volta che i dati cambiano.

Come funziona lo strumento

Ecco cosa succede tra il momento in cui lasci cadere un file e quello in cui vedi i punti. Ogni passo avviene nel tuo browser.

1. Analizzare il testo. Il testo viene analizzato come JSON. Se non riesce e il file ha più righe, ogni riga viene analizzata come JSON Lines. Un eventuale byte order mark all'inizio viene tolto.
2. Rifiutare i file che hanno un loro visualizzatore. GeoJSON e TopoJSON vengono riconosciuti dal loro type e indirizzati al visualizzatore giusto di questo sito, perché contengono già una vera geometria.
3. Trovare gli elenchi di record. Lo strumento percorre il documento fino a 8 livelli di profondità e raccoglie ogni array fatto soprattutto di oggetti, e ogni oggetto i cui valori sono tutti record. Ogni record viene appiattito in percorsi con il punto.
4. Riconoscere le coordinate. I nomi dei campi vengono confrontati con gli elenchi qui sopra. Ogni coppia candidata viene provata su un massimo di 300 record, e vince la coppia con più valori validi. Se nessuna coppia funziona, si provano i campi singoli con due numeri.
5. Costruire i punti. Ogni record viene letto con i campi scelti. I numeri in forma di testo vengono convertiti, i valori fuori da ±90 / ±180 vengono contati e saltati, e i record che andrebbero bene se scambiati vengono contati a parte.
6. Disegnare, colorare ed esportare. I punti vengono disegnati su un layer canvas e la mappa fa zoom su di essi. Se cambi un campo, l'ordine o il colore, la mappa si ridisegna subito. Le esportazioni usano esattamente i record che vedi.

Il riconoscimento è solo una prima proposta. Ogni scelta si può cambiare nella barra laterale, e la mappa si aggiorna appena la cambi, quindi una proposta sbagliata costa un clic.

Controllare le coordinate: intervalli, scambi e precisione

Una coppia di latitudine e longitudine sono solo due numeri. Questi tre controlli ti dicono se i numeri hanno senso.

valido  ⇔  −90 ≤ latitudine ≤ 90   e   −180 ≤ longitudine ≤ 180

latitudine 91.2, longitudine 10.5   →  non valido (latitudine troppo grande)

salvato:   lat = 151.21,  lng = −33.87   →  non valido
scambiato: lat = −33.87,  lng = 151.21   →  valido (Sydney)

1° latitudine  ≈ 111 320 m
1° longitudine ≈ 111 320 m · cos(latitudine)

decimali   passo in latitudine   passo in longitudine a Berlino (52.52°)
1          11.1 km               6.8 km
2          1.1 km                680 m
3          111 m                 68 m
4          11.1 m                6.8 m
5          1.1 m                 0.68 m
6          0.11 m                0.07 m

Quando serve questo visualizzatore

Queste sono le situazioni in cui uso un visualizzatore di mappe JSON.

1. Controllare la risposta di un'API. Incolla la risposta di un'API meteo, dei trasporti o di uno store locator e vedi subito se le posizioni hanno senso, prima di scrivere codice per la mappa.
2. Controllare l'esportazione di un'app o di un database. App di consegne, CRM e piattaforme IoT esportano spesso JSON. Metti l'esportazione su una mappa per trovare record con coordinate mancanti o sbagliate.
3. Convertire JSON in GeoJSON o CSV. Ottieni un file GeoJSON per QGIS o ArcGIS, oppure un CSV per Excel, senza scrivere script.
4. Trovare coordinate scambiate. L'avviso e la mappa rendono facile vedere l'errore classico in cui latitudine e longitudine si scambiano di posto da qualche parte in una catena di elaborazione.
5. Esplorare portali open data. Molti portali open data offrono JSON accanto al CSV. Il JSON spesso conserva dettagli annidati che il CSV perde, e puoi metterlo direttamente su una mappa.
6. Raggruppare i punti secondo un campo. Colora per stato, categoria o tipo per vedere degli schemi, per esempio quali stazioni sono offline o quali negozi aprono la domenica.
7. Fare debug del codice delle mappe. Se la tua mappa mostra punti nel posto sbagliato, carica qui lo stesso JSON. Se qui i punti sono giusti, l'errore è nel tuo codice, spesso uno scambio tra [lat, lng] e [lng, lat].
8. Insegnare JSON e coordinate. Gli studenti possono incollare piccoli esempi di JSON e vedere come l'annidamento, i nomi dei campi e l'ordine delle coordinate cambiano il risultato sulla mappa.

Domande frequenti

Librerie e ringraziamenti

La lettura del JSON e il riconoscimento delle coordinate sono stati scritti per questo sito. La mappa è costruita su software open source.

• Leaflet 1.9 · BSD-2-Clause · Volodymyr Agafonkin and contributors
  Disegna la mappa interattiva, il layer di punti su canvas e i popup.
• OpenStreetMap, Protomaps (hosted by KONAKTIVE), CARTO, Esri World Imagery · ODbL e condizioni del fornitore · OpenStreetMap contributors, Protomaps, KONAKTIVE, CARTO, Esri
  Tile e immagini della mappa di base.

Strumenti correlati