Aggiungere un livello dati semplice

L'SDK Web di Mappe di Azure fornisce un modulo di I/O spaziale che include una SimpleDataLayer classe . Questa classe semplifica il rendering delle caratteristiche con stile su una mappa. Può anche eseguire il rendering di set di dati con proprietà di stile e set di dati che contengono tipi geometrici misti.

Il livello dati semplice consente di ottenere questa funzionalità eseguendo il wrapping di più livelli di rendering e usando espressioni di stile. Le espressioni di stile cercano livelli di cui è stato eseguito il wrapping per le proprietà di stile comuni. Le atlas.io.read funzioni e atlas.io.write usano queste proprietà per leggere e scrivere stili in un formato di file supportato. Quando si aggiungono proprietà a un formato di file supportato, è possibile usare il file per scopi come la visualizzazione di caratteristiche con stile su una mappa.

La SimpleDataLayer classe fornisce anche una funzionalità popup predefinita con un modello popup. Il popup viene visualizzato quando viene selezionata una funzionalità. Questo livello supporta anche i dati in cluster. Quando un cluster è selezionato, la mappa esegue lo zoom avanti nel cluster e la espande in singoli punti e sottocluster. Se non è necessario, è possibile disabilitare la funzionalità popup.

La SimpleDataLayer classe deve essere usata in set di dati di grandi dimensioni che includono caratteristiche con molti tipi e stili geometry applicati. Quando si usa questa classe, viene aggiunto un overhead di sei livelli che contengono espressioni di stile. Se è sufficiente eseguire il rendering di alcuni tipi di geometria e stili in una funzionalità, potrebbe essere più efficiente usare un livello di rendering principale. Per altre informazioni, vedere Aggiungere un livello bolla alla mappa, Aggiungere un livello linea alla mappa e Aggiungere un livello poligono alla mappa.

È possibile usare la SimpleDataLayer classe come gli altri livelli di rendering. Il codice seguente illustra come usare un livello dati semplice in una mappa:

//Create a data source and add it to the map.
var datasource = new atlas.source.DataSource();
map.sources.add(datasource);

//Add a simple data layer for rendering data.
var layer = new atlas.layer.SimpleDataLayer(datasource);
map.layers.add(layer);

Il frammento di codice seguente illustra come usare un livello dati semplice che fa riferimento ai dati di un'origine online:

<script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.min.js"></script>

<script>
    function InitMap() {
        var map = new atlas.Map("myMap", {
            center: [-73.967605, 40.780452],
            zoom: 12,
            view: "Auto",

            //Add authentication details to connect to Azure Maps.
            authOptions: {
                // Get an Azure Maps key at https://azuremaps.com/.
                authType: "subscriptionKey",
                subscriptionKey: '{Your-Azure-Maps-Subscription-key}'
            }
        });

        //Wait until the map resources are ready.
        map.events.add("ready", function () {
            //Create a data source and add it to the map.
            var datasource = new atlas.source.DataSource();
            map.sources.add(datasource);

            //Add a simple data layer for rendering data.
            var layer = new atlas.layer.SimpleDataLayer(datasource);
            map.layers.add(layer);

            //Load an initial data set.
            const dataSet = {
                type: "FeatureCollection",
                bbox: [0, 0, 0, 0],
                features: [
                    {
                        type: "Feature",
                        geometry: {
                            type: "Point",
                            coordinates: [0, 0]
                        },
                        properties: {
                            color: "red"
                        }
                    }
                ]
            };

            loadDataSet(dataSet);

            function loadDataSet(r) {
                //Update the features in the data source.
                datasource.setShapes(r);

                //If bounding box information is known for data, set the map view to it.
                if (r.bbox) {
                    map.setCamera({
                        bounds: r.bbox,
                        padding: 50
                    });
                }
            }
        });
    }
</script>

Quando si aggiungono funzionalità all'origine dati, il livello dati semplice li esegue nel modo più appropriato. È possibile impostare gli stili come proprietà per ogni singola funzionalità.

Il codice di esempio precedente mostra una funzionalità di punto geografico geoJSON (JavaScript Object Notation) con una color proprietà impostata su red.

Il codice di esempio esegue il rendering della funzionalità del punto usando il livello dati semplice e il risultato viene visualizzato come segue.

Il livello dati semplice è uno strumento potente negli scenari seguenti:

• Un'origine dati include diversi tipi di funzionalità.
• Le funzionalità nel set di dati hanno diverse proprietà di stile impostate singolarmente.
• Non si è certi del contenuto del set di dati.

Ad esempio, quando si analizzano feed di dati XML, è possibile che non si conosca lo stile e i tipi di geometria delle caratteristiche. L'esempio di opzioni livello dati semplice mostra come il livello dati semplice esegue il rendering delle funzionalità di un file Keyhole Markup Language (KML). È anche possibile visualizzare le opzioni nella SimpleDataLayer classe . Per il codice sorgente per questo esempio, vedere Simple data layer options.html negli esempi di codice di Mappe di Azure in GitHub.

Il livello dati semplice esegue il wrapping di diversi livelli di rendering principali: bolla, simbolo, linea, poligono ed estruso. Usa espressioni per cercare proprietà di stile valide nelle singole funzionalità.

I due set principali di nomi di proprietà supportati sono Mappe di Azure e GitHub. La maggior parte dei nomi delle proprietà delle opzioni di livello Mappe di Azure è supportata nel livello dati semplice come proprietà di stile delle funzionalità. Alcune opzioni di livello includono espressioni che supportano nomi di proprietà di stile comunemente usati da GitHub.

Il supporto della mappa GeoJSON di GitHub definisce questi nomi di proprietà, usati per definire lo stile dei file GeoJSON archiviati e sottoposti a rendering all'interno della piattaforma. La maggior parte delle proprietà di stile di GitHub è supportata nel livello dati semplice, ad eccezione delle proprietà di marker-symbol stile.

Se il lettore incontra una proprietà di stile meno comune, la converte nella proprietà di stile più simile Mappe di Azure. Inoltre, è possibile eseguire l'override delle espressioni di stile predefinite usando la getLayers funzione del livello dati semplice e aggiornando le opzioni su uno dei livelli.

Le sezioni seguenti forniscono informazioni dettagliate sulle proprietà di stile predefinite supportate dal livello dati semplice. Anche l'ordine dei nomi di proprietà supportati è la priorità. Se vengono definite due proprietà di stile per la stessa opzione di livello, la prima nell'elenco ha la precedenza. I colori possono essere qualsiasi valore di colore CSS3 (HEX, RGB, RGBA, HSL, HSLA) o un valore di colore denominato.

Se una funzionalità è o PointMultiPointe non dispone di una proprietà immagine da usare come icona personalizzata per eseguire il rendering del punto come simbolo, viene eseguito il rendering con un oggetto BubbleLayer.

¹ I valori di dimensione e scala sono considerati valori scalari e vengono moltiplicati per 8.

² Se si specifica l'opzione GitHub marker-size , il raggio usa i valori seguenti:

Il rendering dei cluster viene eseguito anche nel livello bolla. Per impostazione predefinita, il raggio di un cluster è impostato su 16. Il colore del cluster varia a seconda del numero di punti al suo interno, come definito nella tabella seguente:

Se una funzionalità è o PointMultiPoint, con una proprietà immagine usata come icona personalizzata per eseguire il rendering del punto come simbolo, viene eseguito il rendering con un oggetto SymbolLayer.

¹ Se si specifica l'opzione GitHub marker-size , vengono usati i valori seguenti per l'opzione relativa alle dimensioni dell'icona:

Se la funzionalità punto è un cluster, il rendering della proprietà point_count_abbreviated viene eseguito come etichetta di testo. Non viene eseguito il rendering di un'immagine.

Se la funzionalità è , LineStringMultiLineString, Polygono MultiPolygon, viene eseguito il rendering con un oggetto LineLayer.

Se la funzionalità è o PolygonMultiPolygone non ha una proprietà height o se la proprietà height è zero, ne viene eseguito il rendering con un oggetto PolygonLayer.

Se la funzionalità è o PolygonMultiPolygone ha una proprietà height con un valore maggiore di zero, viene eseguito il rendering con un oggetto PolygonExtrusionLayer.

Altre informazioni sulle classi e i metodi in questo articolo:

• SimpleDataLayer
• SimpleDataLayerOptions

Vedere gli articoli seguenti per ottenere altri esempi di codice da aggiungere alle mappe:

• Leggere e scrivere dati spaziali
• Aggiungere un livello mappa dall'Open Geospatial Consortium
• Connettersi a un servizio WFS
• Operazioni di I/O di base
• Dettagli del formato dati supportati