如果图标功能，OpenLayers 3 切换可见性

Question

从表面上看这似乎很简单，但我无法弄清楚如何使用 OpenLayers 的版本 3 API 切换标记功能的可见性。

在我的情况下，我正在向矢量图层添加特征。每个要素都是一个标记图标，表示感兴趣的地方。当我单击页面上其他地方的复选框时，我希望该功能出现或消失（视情况而定）。我将 JQuery 与 OL3 结合使用，但我不关心解决方案是 jquery 还是香草 javascript.

代码片段：

var vectorSource = new ol.source.Vector({
    projection: "EPSG:4326"
});
var vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    style: fieldIconStyle
});



var map = new ol.Map({
    layers: [osm, digitalglobe, vectorLayer],//osm and digitalglobe exist in unquoted code
    target: 'map',
    controls: ol.control.defaults({
        attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
            collapsible: false
        })
    }).extend([mousePositionControl]),
    view: new ol.View({
        center: [0, 0],
        zoom: 2
    })
});

function checkedchanged(item)//item is the checkbox that was clicked
{
    //this function does get called successfully.
    //alert($(item).prop('checked'));
    var selected = $(item).prop('checked');
    var id = $(item).val();

    vectorSource.forEachFeature(function (item) {

        var props = item.getProperties();
        if (props.FieldId = id) {
            item.setStyle({visible: selected});//I have tried many different things here, all to no avail
        }
    });
}

Answer 1

您可以将Point节点设置成一个数组，该数组在地图的整个运行期间都有效。单击一个点时，首先删除图层的所有功能，然后再次遍历此数组并仅添加未单击的项目。然后只需在地图上重新绘制图层 - 这应该可以解决问题。因此每个Point都有一个唯一的ID是必要的。

如果图标功能，OpenLayers 3 切换可见性

OpenLayers 3 toggle visibility if icon feature

jquery

openlayers-3