Стили карты Google с буклетом ngx

Question

Кажется, у меня проблемы с использованием стилей, созданных мастером стилей карт Google с плагином ngx-leaflet angular. Например, я использовал мастер стилей карт Google, чтобы уменьшить количество меток, отображаемых на карте.

Хотел спросить, где в коде применить данный объект json, созданный мастером стилей.

У меня есть следующий HTML:

<div leaflet 
 [leafletOptions]="options" 
 [leafletLayers]="layers" 
 [leafletLayersControl]="layersControl" 
 [leafletFitBounds]="fitBounds" 
 (leafletMapReady)="onMapReady($event)">
</div>

и этот сгенерированный стиль:

 style = [
    {
      "featureType": "poi",
      "elementType": "labels.text",
      "stylers": [
        {
          "visibility": "off"
        }
      ]
    },
    {
      "featureType": "poi.business",
      "stylers": [
        {
          "visibility": "off"
        }
      ]
    },
    {
      "featureType": "road",
      "elementType": "labels.icon",
      "stylers": [
        {
          "visibility": "off"
        }
      ]
    },
    {
      "featureType": "transit",
      "stylers": [
        {
          "visibility": "off"
        }
      ]
    }
  ];

Не могу найти его в документации и пытался разными способами. Есть ли способ сделать это?

Answer 1

Я тоже хотел создать собственный стиль для своей карты, но я не нашел способа сделать это так просто, как это можно сделать с помощью Google Maps. Тем не менее, вы можете попробовать некоторые из стилей, представленных здесь. Чтобы добавить стиль, вам просто нужно добавить слой на карту.

В вашем классе компонентов:

this.mapOptions = {
    layers: [
        tileLayer('https://cartodb-basemaps-{s}.global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}{r}.png',
            { attribution: '© OpenStreetMap contributors' })
    ],
    ...
};

В вашем шаблоне:

<div style="height: 369px;" leaflet [leafletOptions]="mapOptions"></div>

Ссылка дана как параметр:

https://cartodb-basemaps-/{s}.global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}{r}.png

в tileLayer соответствует CartoDB.Voyager выбранный стиль.

Я надеюсь, что эта альтернатива может быть полезной.