Добавление простого уровня данных

Веб-SDK Azure Maps предоставляет модуль Spatial IO, включающий класс. Этот класс упрощает отрисовку стилизованных объектов на карте. Он может даже визуализировать наборы данных, которые обладают свойствами стиля, а также наборы данных, содержащие типы со смешанной геометрией.

Простой уровень данных обеспечивает эту функциональность путем упаковки нескольких слоев отрисовки и использования выражений стиля. Выражения стиля ищут обёрнутые слои для поиска общих свойств стиля. Функции atlas.io.read и atlas.io.write используют эти свойства для чтения и записи стилей в поддерживаемый формат файла. При добавлении свойств в поддерживаемый формат файла можно использовать этот файл для таких целей, как отображение стилей функций на карте.

Класс SimpleDataLayer также предоставляет встроенную функцию всплывающего окна с шаблоном всплывающего окна. Всплывающее окно появляется при выборе функции. Этот уровень также поддерживает кластеризованные данные. При выборе кластера карта увеличивает масштаб кластера и расширяет его в отдельные точки и подкластеры. Вы можете отключить функцию всплывающего окна, если она не нужна.

Класс SimpleDataLayer предназначен для использования в больших наборах данных, которые включают функции с множеством примененных типов геометрии и стилей. При использовании этого класса добавляется нагрузка на шесть слоев, содержащих выражения стиля. Если необходимо отобразить только несколько типов геометрии и стилей в компоненте, это может оказаться более эффективным для использования основного слоя отрисовки. Дополнительные сведения см. в разделе "Добавление пузырькового слоя на карту", добавление слоя линии на карту и добавление многоугольника на карту.

Использование простого уровня данных

Вы можете использовать класс SimpleDataLayer так же, как и другие слои отрисовки. В следующем коде показано, как использовать простой слой данных на карте:

//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);

В следующем фрагменте кода показано, как использовать простой слой данных, который ссылается на данные из онлайн-источника:

<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>

При добавлении объектов в источник данных простой слой данных отображает их наиболее оптимальным образом. Стили можно задать в качестве свойств для каждой отдельной функции.

В приведенном выше примере кода показана функция точки нотации объектов JavaScript (GeoJSON) с заданным colorсвойствомred.

Пример кода отображает функцию точки с помощью простого слоя данных, а результат отображается следующим образом.

Простой уровень данных — это мощный инструмент в следующих сценариях:

• Источник данных включает несколько типов признаков.
• Функции в наборе данных имеют несколько свойств стиля, которые задаются по отдельности.
• Вы не уверены, что содержит набор данных.

Например, при анализе веб-каналов XML-данных может не быть известно о типах стиля и геометрии функций. В примере параметров уровня простых данных показано, как простой слой данных отображает функции файла языка разметки ключей (KML). Также можно просмотреть параметры в SimpleDataLayer классе. Исходный код этого примера см. в разделе "Простой уровень данных" options.html в примерах кода Azure Maps в GitHub.

Поддерживаемые по умолчанию свойства стиля

Простой слой данных упаковывает несколько основных слоев отрисовки: пузырь, символ, линия, многоугольник и экструндированный многоугольник. В нем используются выражения для поиска допустимых свойств стиля для отдельных функций.

Двумя основными наборами поддерживаемых имен свойств являются Azure Maps и GitHub. Большинство имен свойств параметров слоя Azure Maps поддерживаются в простом слое данных в качестве свойств стиля функций. Некоторые параметры слоя включают выражения, поддерживающие имена свойств стиля, которые часто используются GitHub.

Поддержка GeoJSON-карт на GitHub определяет эти имена свойств, которые используются для оформления файлов GeoJSON, хранящихся и отображаемых на платформе. Большинство свойств стилизации GitHub поддерживаются в простом слое данных, за исключением marker-symbol свойств стилизации.

Если читатель сталкивается с менее распространенным свойством стиля, он преобразует его в самое похожее свойство стиля Azure Maps. Кроме того, можно переопределить выражения стиля по умолчанию с помощью getLayers функции простого слоя данных и обновления параметров на любом из уровней.

В следующих разделах содержатся сведения о свойствах стиля по умолчанию, поддерживаемых простым уровнем данных. Порядок поддерживаемых имен свойств также является приоритетом. Если для одного и того же параметра слоя определены два свойства стиля, первый в списке имеет приоритет. Цвета могут быть любым значением цвета CSS3 (HEX, RGB, RGBA, HSL, HSLA) или именованным значением цвета.

Свойства стиля слоя пузырьков

Если функция является Point или MultiPoint, и не имеет свойства изображения для использования в качестве пользовательского значка для отображения точки как символа, она отрисовывается с помощью элемента BubbleLayer.

¹ Значения размера и шкалы считаются скалярными значениями и умножаются на 8.

² Если указан параметр GitHub marker-size , радиус использует следующие значения:

Кластеры также отображаются на уровне пузырьков. По умолчанию радиус кластера имеет значение 16. Цвет кластера зависит от количества точек в кластере, как определено в следующей таблице:

Свойства стиля символа

Если функция является Point или MultiPoint, с свойством изображения, используемым в качестве пользовательского значка для отображения точки в виде символа, она отображается с помощью SymbolLayer.

¹ Если указан параметр GitHub marker-size , для параметра размера значка используются следующие значения:

Если функция точки является кластером, point_count_abbreviated свойство отображается как текстовая метка. Изображение не отображается.

Свойства стиля линии

Если функция — это LineString, MultiLineStringPolygonили MultiPolygonона отображается с помощью LineLayerфункции.

Свойства стиля многоугольника

Если объект является Polygon или MultiPolygon, и не имеет свойства высоты, или если свойство высоты равно нулю, он отрисовывается с помощью PolygonLayer.

Свойства стиля вытянутого многоугольника

Если Polygon или MultiPolygon является функцией и имеет свойство высоты со значением больше нуля, оно отрисовывается с помощью PolygonExtrusionLayer.

Связанный контент

Дополнительные сведения о классах и методах в этой статье:

• SimpleDataLayer
• SimpleDataLayerOptions

Ознакомьтесь со следующими статьями, чтобы получить дополнительные примеры кода для добавления в карты:

• Чтение и запись пространственных данных
• Добавление слоя карты из открытого геопространственного консорциума
• Подключение к службе WFS
• Основные операции ввода-вывода
• Поддерживаемые сведения о формате данных