我试图在我的openlayer3应用程序中显示来自geoserver的wfs gml层的属性作为标签。我成功地将标签获取为文本,但是无法访问特定的属性“名称”。给出的是我正在使用的代码。
var sourceWFS = new ol.source.Vector({
loader: function (extent) {
$.ajax('..../geoserver/harry/ows?', {
type: 'GET',
data: {
service: 'WFS',
version: '1.1.0',
request: 'GetFeature',
typename: 'ABC',
srsname: 'EPSG:3857',
geometryField:'geometry',
bbox: extent.join(',') + ',EPSG:3857'
}
}).done(function (response) {
sourceWFS.addFeatures(formatWFS.readFeatures(response));
});
},
strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ()),
strategy: ol.loadingstrategy.bbox,
projection: 'EPSG:3857',
});
var layerWFS = new ol.layer.Vector({
source: sourceWFS
});
var interaction;
var interactionSelectPointerMove = new ol.interaction.Select({
condition: ol.events.condition.pointerMove
});
var interactionSelect = new ol.interaction.Select({
style: new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'rgba(255,0,0,1.0)',
width: 1
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.5)'
}),
text: new ol.style.Text({
text:("abcd")
})
})
});
var interactionSnap = new ol.interaction.Snap({
source: layerWFS.getSource()
});
我在选择中得到abcd
作为标签
答案 0 :(得分:1)
您将需要一种样式功能,以便根据您希望显示的任何要素属性以该样式设置文本
var selectStyle = new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'rgba(255,0,0,1.0)',
width: 1
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.5)'
}),
text: new ol.style.Text({
text:("abcd")
})
});
var interactionSelect = new ol.interaction.Select({
style: function(feature) {
selectStyle.getText().setText(feature.get('name'));
return selectStyle;
}
});
答案 1 :(得分:0)
答案 2 :(得分:0)
您实际显示的是字符串“ abcd”本身,而不是“ abcd”属性的值。
要访问ol.Style
中的某些功能属性值,必须使用StyleFunction
,如下所示:
style: function(feature, resolution){
return new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'rgba(255,0,0,1.0)',
width: 1
}),
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.5)'
}),
text: new ol.style.Text({
text: feature.get("abcd");
})
})
}