javascript - Openlayers:如何删除功能?
问题描述
当用户单击地图添加指针或标记时,我正在尝试基于 Openlayers 运行脚本。我已经完成了这部分,但我在这里有一个小问题。
当用户单击地图时,较旧的指针将在那里变硬,但我想删除所有指针并尝试仅保留用户最近单击的点。
请帮我解决这个问题。这是我的代码:[openlayers 3]
<script>
var
vectorSource = new ol.source.Vector(),
vectorLayer = new ol.layer.Vector({
source: vectorSource
}),
olView = new ol.View({
center: ol.proj.fromLonLat([48.4831, 36.6681]),
zoom: 8,
minZoom: 2,
maxZoom: 20
}),
map = new ol.Map({
target: document.getElementById('map'),
view: olView,
layers: [
new ol.layer.Tile({
style: 'Aerial',
source: new ol.source.OSM()
}),
vectorLayer
]
})
;
var iconStyle = new ol.style.Style({
image: new ol.style.Icon({
anchor: [0.5, 46],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
opacity: 0.75,
src: 'https://openlayers.org/en/v3.8.2/examples/data/icon.png'
}),
text: new ol.style.Text({
font: '12px Calibri,sans-serif',
fill: new ol.style.Fill({ color: '#000' }),
stroke: new ol.style.Stroke({
color: '#fff', width: 2
}),
text: 'Some text'
})
});
map.on('click', function(evt){
var feature = new ol.Feature(
new ol.geom.Point(evt.coordinate)
);
var lon = ol.proj.toLonLat(evt.coordinate)[0];
var lat = ol.proj.toLonLat(evt.coordinate)[1];
console.info('longitude is: ' + lon + 'latitude is: ' + lat);
feature.setStyle(iconStyle);
vectorSource.addFeature(feature);
});
</script>
解决方案
vectorSource.clear();
在添加功能之前使用:
vectorSource.clear();
vectorSource.addFeature(feature);
推荐阅读
- java - 获取选定的数字行并将其返回为整数格式
- c++ - 为什么共享指针在 main 末尾没有超出范围?
- mysql - 是否可以为每个 KEY 制作 UNIQUE VALUE?
- python - OCR tesseract 改善详细背景的结果
- c++ - 为什么通过打印星形矩形来移动第一行?
- r - 无法使用 tidy 从 aov 中获得额外的 p 值
- angular - 如何保护阵列以供 Firebase Firestore 中的用户访问?
- vue.js - 使用 AXIOS GET 和 VUE JS 检索 CSV 内容 - 返回超时错误
- javascript - 在反应中,我提出了 CORS 策略错误,所以我该如何处理它
- php - wopress 分页不适用于下一页或预览页面