OL3:按坐标从图层中获取特征 [英] OL3: GetFeature from Layers by Coordinate
问题描述
我想通过坐标获取图层的特征.此外,我想在弹出窗口中打开此功能,到目前为止我已经通过一个 onclick 事件解决了这个问题.但是我想通过给出特征的坐标并打开特征的弹出窗口来实现.
I want to get the Feature of a Layer by coordinate. Furthermore I want to open this feature in a popup, which I have solved so far by an onclick event. But I want to realize by giving the coordinates of a feature and opening the popup of the featue.
我有一个带有地图的图层和一个带有特征的图层:
I have a layer with the map and a layer with the features:
if (trackMap != null) {
for (var i = 0; i < trackMap.length; i++) {
var trackInfo = trackMap[i];
lat = parseFloat(trackInfo.lat);
lon = parseFloat(trackInfo.lon);
var layergpx = new ol.layer.Vector({
source: new ol.source.Vector({
parser: new ol.parser.GPX(),
url: '${contextRoot}/gps/gpx2' + trackInfo.url
})
});
layers.push(layergpx);
}
}
我想在另一个Javascript函数中获取这一层的特征.
I want to get the feature of this layer in another Javascript function.
我如何通过点击地图打开弹出窗口:
How I open a pop up by clicking on the map:
/**
* The Click Event to show the data
*/
var element = document.getElementById('popup');
var popup = new ol.Overlay({
element: element,
positioning: ol.OverlayPositioning.BOTTOM_CENTER,
stopEvent: false
});
map.addOverlay(popup);
map.on('singleclick', function(evt) {
map.getFeatures({
pixel: evt.getPixel(),
layers: vectorLayers,
success: function(layerFeatures) {
var feature = layerFeatures[0][0];
if (feature) {
var geometry = feature.getGeometry();
var coord = geometry.getCoordinates();
popup.setPosition(coord);
$(element).popover({
'placement': 'top',
'html': true,
'content': feature.get('desc')
});
$(element).popover('show');
} else {
$(element).popover('destroy');
}
}
});
});
但我不希望通过在地图上单击来打开此功能,而是通过在文本字段中输入坐标和地图打开此弹出窗口,就像在 onclick 事件中一样.
But I want this feature not to be opened by clicking on it on the map, but by entering a coordinate in a textfield and the map opens this pop up, like in the onclick event.
推荐答案
看看这个例子是否对你有帮助:http://openlayers.org/en/latest/examples/kml.html
Take a look at this example to see if it helps you: http://openlayers.org/en/latest/examples/kml.html
var displayFeatureInfo = function(pixel) {
map.getFeatures({
pixel: pixel,
layers: [vector],
success: function(featuresByLayer) {
var features = featuresByLayer[0];
var info = [];
for (var i = 0, ii = features.length; i < ii; ++i) {
info.push(features[i].get('name'));
}
document.getElementById('info').innerHTML = info.join(', ') || ' ';
}
});
map.getFeatures() 有这个成功回调,它提供在 layer: [vector] 中指定的层的特征.随意定制它以获得您需要的东西.
map.getFeatures() has this success callback where it delivers the features of the layers specified in layers: [vector]. Customize it at will to get what you need.
=== 更新 ===
在 OpenLayers 3 的 Map 对象中有一个函数:getPixelFromCoordinate
In the OpenLayers 3's Map object you have a function: getPixelFromCoordinate
/**
* @param {ol.Coordinate} coordinate Coordinate.
* @return {ol.Pixel} Pixel.
*/
ol.Map.prototype.getPixelFromCoordinate = function(coordinate) {
var frameState = this.frameState_;
if (goog.isNull(frameState)) {
return null;
} else {
var vec2 = coordinate.slice(0, 2);
return ol.vec.Mat4.multVec2(frameState.coordinateToPixelMatrix, vec2, vec2);
}
};
这篇关于OL3:按坐标从图层中获取特征的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!