Можно ли удалить метки с карт Azure? - PullRequest
Новая
       6

Можно ли удалить метки с карт Azure?

0 голосов
/ 28 июня 2019

Я хочу визуализировать статическую карту (в виде изображения) с помощью карт Azure, которая показывает только базовое представление о мире и пару штифтов, которые я добавлю на нее.Я не хочу, чтобы слой надписей отображал названия океанов и стран.

Просмотр образцов кода Azure Maps (https://azuremapscodesamples.azurewebsites.net/)) Я просто не могу найти ничего, что позволило бы нам упроститькарта.

Карты Google поддерживают это, устанавливая видимость для меток в false. Старые Карты Microsoft поддерживали это, устанавливая labelOverlay в значение hidden. Я хотел бы создать что-то вроде этого: https://snazzymaps.com/style/209544/no-labels

Как все метки можно скрыть на карте Azure (или в этом случае на карте Bing), чтобы я мог получить простое изображение с моими булавками, на которых установлены мои метки, и с удалением всех других меток?

1 Ответ

1 голос
/ 28 июня 2019

Для этого нет документированного API, но есть неподдерживаемый способ сделать это. Базовые карты в Azure Maps используют схему стиля Mapbox Vector Tile, которая является открытым стандартом. Можно получить доступ к слоям базовой карты и скрыть любые слои меток, которые вы хотите. Вот пример кода, который скрывает все метки в базовой карте: 

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />

    <link rel="stylesheet" href="https://atlas.microsoft.com/sdk/css/atlas.min.css?api-version=1" type="text/css" />
    <script src="https://atlas.microsoft.com/sdk/js/atlas.min.js?api-version=1"></script>

    <script type='text/javascript'>
        var map;

        function GetMap() {

            map = new atlas.Map('myMap', {
                authOptions: {
                    authType: 'subscriptionKey',
                    subscriptionKey: '<YOUR AZURE MAPS KEY>'
                }
            });

            map.events.add('ready', function () {
                var layers = map.map.getStyle().layers;

                for (var i = 0; i < layers.length; i++) {
                    if (layers[i].type == 'symbol' && layers[i].source == 'vectorTiles' && layers[i].layout && layers[i].layout['text-field'] && layers[i].layout['text-field'] !== '') {
                        map.map.setLayoutProperty(layers[i].id, 'visibility', 'none');
                    }
                }

                //Add any your post map load code here.
            });
        }
    </script>
</head>
<body onload="GetMap()">
    <div id="myMap" style="height:100vh"></div>
</body>
</html>
...