1

我使用 Openlayers 3 (v3.11.2) 创建了一张带有 Openstreetmap 底图的地图。我正在通过 Overpass API 从 Openstreetmap 加载功能。

/** OSM Overpass Layer*/
var osmxmlFormat = new ol.format.OSMXML();

/** Public Transport Layer*/
var osmTransportSource = new ol.source.Vector({
    loader: function(extent, resolution, projection) {
        var url = 'https://overpass-api.de/api/interpreter?data=%5Bout%3Axml%5D%3Barea%283600062422%29%2D%3E%2E' +
        'searchArea%3B%28node%5B%22public%5Ftransport%22%3D%22stop%5Fposition%22%5D%28area%2EsearchArea%29%3B%' +
        '29%3B%28%2E%5F%3B%3E%3B%29%3Bout%20body%3B%0A';
        $.ajax(url).then(function(response) {
            var features = osmxmlFormat.readFeatures(response,
                {featureProjection: projection});
            osmTransportSource.addFeatures(features);
        });
    }
});

var osmTransportVector = new ol.layer.Vector({
    source: osmTransportSource
});

此外，我还能够构建一个弹出窗口，该窗口能够从一个正在单击的功能中获取信息。但我只能让它与存储在与我的脚本相同的文件夹中的 GEOJson 一起工作。

/**Elements that make up the popup.*/
var container = document.getElementById('popup');
var content = document.getElementById('popup-content');


/**Create an overlay to anchor the popup to the map.*/
var overlay = new ol.Overlay(({
    element: container,
    autoPan: true,
    autoPanAnimation: {
        duration: 250
    }
}));

...

/**Add a pointermove handler to the map to render the popup.*/
    map.on('click', function(evt) {
        var coordinate = evt.coordinate;
        var feature = map.forEachFeatureAtPixel(evt.pixel, 
            function(feature, layer) {
                return feature;
            }, null, function(layer) {
                return layer === districtLayer;
            });
        if(feature != undefined){
         content.innerHTML = feature.get('OTEIL'); //OTEIL is the name of a feature propertie in my GEOJson
         overlay.setPosition(coordinate);
         }
    });

现在的问题是：如何获取 OSM 数据中提供的标签信息。我已经在一些这样的网页上看到了它：带有 OSM 标签的弹出窗口图片，链接到页面。但我无法理解他们的脚本，因为我是编程初学者，这是我的第一个网页（也是我关于 stackoverflow 的第一个问题）。因此 - 如果你回答 - 请详细解释必须做什么。

4

0 回答 0