Динамический векторный слой OpenLayers 3 со стратегией bbox без jQuery

Я пытаюсь создать простую карту с использованием JavaScript и OpenLayers 3, которая должна динамически загружать XML-данные OpenStreetMap из Overpass API всякий раз, когда изменяется ограничивающая рамка карты. Для этого я создал карту с векторным слоем, и источником этого векторного слоя является векторный источник. Стратегия загрузки этого источника установлена ​​на bbox. Я создал функцию загрузчика, которая вызывается всякий раз, когда изменяется ограничивающая рамка. Однако я пока не мог понять, как на самом деле загрузить данные и добавить их на карту.

var vectorSource = new ol.source.Vector({
    format: ol.format.OSMXML(),
    loader: function(extent, resolution, projection) {
        var epsg4326 = ol.proj.transformExtent(extent, projection, 'EPSG:4326');
        var bbox = epsg4326.join(',');
        var url = 'http://overpass-api.de/api/interpreter?data=(node["light_source"](' + bbox + ');way["light_source"](' + bbox + ');relation["light_source"](' + bbox + ');>;);out meta;';

        ?
    },
    strategy: ol.loadingstrategy.bbox
});

var vector = new ol.layer.Vector({
    source: vectorSource
});

var raster = new ol.layer.Tile({
    source: new ol.source.OSM()
});

var map = new ol.Map({
    layers: [raster, vector],
    target: document.getElementById('map'),
    controls: ol.control.defaults(),
    view: new ol.View({
        center: ol.proj.transform([26.69075, 58.3743], 'EPSG:4326', 'EPSG:3857'),
        maxZoom: 19,
        zoom: 18
    })
});

По сути, возникает вопрос: что я должен поставить на место, отмеченное знаком вопроса в приведенном выше коде? Примеры, которые я нашел до сих пор, в основном используют jQuery, который я не использую в своем проекте, поэтому я ищу что-то, что не использует jQuery. Я знаю, что OpenLayers 3 может загружать данные из Overpass API без jQuery, однако единственные примеры, которые я нашел (и воспроизвел), используют стратегию фиксированной загрузки для загрузки всех данных один раз в начале, а не динамически при изменении ограничивающей рамки.


javascript overpass-api openlayers-3
person Xenos    schedule 27.07.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

в основном $ .ajax из jquery является помощником для объекта javascript xmlHttpRequest.

Вы можете использовать его без jquery: http://www.w3schools.com/xml/xml_http.asp < / а>

вы можете найти много информации об этом в Google (сначала попробуйте загрузить данные из openlayers 3) http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

person David    schedule 28.07.2015
comment
Спасибо за Ваш ответ. Это не совсем то, о чем я думал, поскольку я ожидал, что OpenLayers может загружать функции непосредственно с URL-адреса без внешнего класса HTTP-запроса (как это было бы в случае стратегии фиксированной загрузки, где параметр url дается вместо параметр загрузчика). Но у меня это работает, и я думаю, это то, что OpenLayers в любом случае использует под капотом. - person Xenos; 02.08.2015