Как подписаться на события OpenLayers 5.3.0 в JavaScript?

Я вижу, что OpenLayers 5.3.0 использует наблюдаемые объекты. Документы также освещать события.

Как бы я изменил этот начальный пример на .subscribe() для событий в целом? Я изо всех сил пытаюсь преодолеть разрыв между документами и использованием.

import Map from 'ol/Map';
import View from 'ol/View';
import TileLayer from 'ol/layer/Tile';
import XYZ from 'ol/source/XYZ';

new Map({
  target: 'map',
  layers: [
    new TileLayer({
      source: new XYZ({
        url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
      })
    })
  ],
  view: new View({
    center: [0, 0],
    zoom: 2
  })
});

У меня есть видел примеры со старыми версиями OpenLayers, которые здесь могут не применяться. По крайней мере, в приведенном выше примере «eventListeners» не указан как свойство в 5.3.0 и кажется старым и связанным с обратным вызовом (не наблюдаемым).

Я видел более свежий похожий вопрос здесь с перечисленными полезными ресурсами. Я мог бы использовать пример сценария, чтобы помочь начать работу.

Вы имеете в виду что-то вроде этого: openlayers.org/en/latest/examples/moveend.html ?

bennos 22.05.2019 11:15

Ага! да. Это было просто. Спасибо, что нашли этот пример. Если вы поместите это в ответ, он получит баллы.

Christopher Stevens 22.05.2019 14:16
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
2
130
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете регистрировать события, например, на карте. В последние примеры есть пример для событие завершения движения.

var map = new Map({
    layers: [
        new TileLayer({
            source: new OSM()
        })
    ],
    target: 'map',
    view: new View({
        center: [0, 0],
        zoom: 2
    })
});

map.on('moveend', function(evt){console.info(evt);});

Другие вопросы по теме