Более

OpenLayers 3: Как проверить готовность векторного источника?


ol.source.getState ()не кажется надежным. Когда я вызываю его в векторном источнике, он возвращается готовым, но функции еще недоступны. Код выглядит так:

var vectorSource = new ol.source.Vector ({url: 'world.topo.json', format: new ol.format.TopoJSON ()}); //… инициализация карты с vectorSource console.log (vectorSource.getState ()); // возвращает "готовый" console.log (vectorSource.getFeatureById ("US")); // возвращает null

Есть ли другой способ узнать, готов ли векторный источник?


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

var source = new ol.source.Vector ({loader: function () {var url = '… /data/json/world-110m.json'; var format = new ol.format.TopoJSON (); var source = this ; // отправляем ваше пользовательское событие this.set ('loadstart', Math.random ()); getJson (url, ", function (response) {if (Object.keys (response) .length> 0) {var features = format.readFeatures (response, {featureProjection: 'EPSG: 3857'}); source.addFeatures (features); // отправляем ваше настраиваемое событие source.set ('loadend', Math.random ());}});} });

Установите несколько пользовательских слушателей:

// пользовательский прослушиватель исходного кода source.set ('loadstart', "); source.set ('loadend',"); source.on ('изменение: загрузка старта', функция (эвт) {console.info ('загрузка старта');}); source.on ('изменение: загрузка', функция (эвт) {console.info ('загрузка');});

И функция xhr:

var getJson = function (url, data, callback) {// Должны кодировать данные if (data && typeof (data) === 'object') {var y = ", e = encodeURIComponent; for (x in data) {y + = '&' + e (x) + '=' + e (data [x]);} data = y.slice (1); url + = (/?/.test(url)? '&' : '?') + data;} var xmlHttp = new XMLHttpRequest (); xmlHttp.open ("GET", url, true); xmlHttp.setRequestHeader ('Accept', 'application / json, text / javascript'); xmlHttp .setRequestHeader ('Content-Type', 'application / x-www-form-urlencoded'); xmlHttp.onreadystatechange = function () {if (xmlHttp.readyState! = 4) {return;} if (xmlHttp.status! = 200 && xmlHttp.status! = 304) {callback ("); возвращаться; } обратный вызов (JSON.parse (xmlHttp.response)); }; xmlHttp.send (ноль); };

Рабочая демонстрация.


Вы можете прикрепить слушателя к своему vectorSource http://openlayers.org/en/v3.7.0/apidoc/ol.source.Vector.html#once

например

vectorSource.once ('изменить', функция (е) {если (vectorSource.getState () === 'готово') {vectorSource.getFeatureById ("США");}});

В итоге я получил следующую функцию для выполнения кода, когда векторный источник будет готов:

doWhenVectorSourceReady: функция (обратный вызов) {var map = this; if (map.vectorSource.getFeatureById ("US")) {// Это надежный тест? Перезвоните(); } else {var listener = map.vectorSource.on ('изменение', функция (e) {if (map.vectorSource.getState () == 'готово') {ol.Observable.unByKey (слушатель); callback (); }}); }}

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


Смотреть видео: Openlayers 6 Tutorial #6 - Layer Switcher (October 2021).