Mapbox: как остановить распространение событий при полноэкранном управлении - PullRequest
0 голосов
/ 23 сентября 2019

У меня есть карта mapbox, которая имеет полноэкранный элемент управления.

Я хочу сделать ее динамичной, чтобы при щелчке пользователя A она работала так же, как НО при щелчке пользователя B, тогда появлялось предупреждение javascriptс сообщением типа «Здравствуйте, у вас нет премиум-аккаунта для просмотра в полноэкранном режиме. Пожалуйста, обновите», и ничего не происходит.

Как я могу это сделать?

var mapboxMap = new mapboxgl.Map({
        container: 'map-container',
        style: styleUrl,
        center: [lng, lat],
        zoom: zoomVal
    });
mapboxMap.addControl(new mapboxgl.FullscreenControl());

Кнопка, созданная библиотекой карт:

<button class="mapboxgl-ctrl-icon mapboxgl-ctrl-fullscreen" type="button" aria-label="Enter fullscreen" title="Enter fullscreen"></button>

Пробный 1:

$('.mapboxgl-ctrl-fullscreen').click(function(event) {
   event.stopPropagation();
   if (user == 'user-B') {
      alert('my message');
   }
})

2:

mapboxMap.on('click', function(event) {
   event.stopPropagation();
       if (user == 'user-B') {
          alert('my message');
        }
})

3:

mapboxmap._fullscreencontrol.click(function(event) {.........})

4:

var fsc = new mapboxgl.FullscreenControl();
mapboxMap.addControl(fsc);
fsc._onClickFullscreen(function(event) {.........});

Ничего не сработало.

Ответы [ 2 ]

2 голосов
/ 23 сентября 2019

Поскольку кнопка добавляется Mapbox после загрузки исходного DOM, вам, скорее всего, придется прикрепить слушатель к родительскому элементу (например, document) и перехватывать события, когда они всплывают из любого элемента, на который вы нажимаете.,Вы можете сделать это довольно легко с помощью jQuery:

$(document).on('click', '.mapboxgl-ctrl-fullscreen', function(event) {
   if (user == 'user-B') {
      alert('my message');
   }
});
Дополнительная информация
0 голосов
/ 23 сентября 2019

Вы можете поставить if / else на фактическое добавление элемента управления на карту.Это может выглядеть примерно так:

if (userA) {
    mapboxMap.addControl(new mapboxgl.FullscreenControl());
} else if (userB) {
    // do something else
} else {
    // do something with error
}
...