openlayers点击地图上的图标后描边

在OpenLayers中，当点击地图上的图标时添加描边通常涉及监听鼠标事件并在用户交互时更新矢量图层的状态。以下是一个简单的示例，展示了如何在OpenLayers中实现这个功能：

首先，你需要创建一个图标（Marker），并将其添加到地图上：

var icon = new ol.style.Icon({
  src: 'path/to/your/icon.png', // 图标路径
});

var markerFeature = new ol.Feature({
  geometry: new ol.geom.Point(x, y), // 标记的位置
  style: {
    image: icon,
  },
});

var vectorSource = new ol.source.Vector({
  features: [markerFeature],
});

var layer = new ol.layer.Vector({
  source: vectorSource,
});
map.addLayer(layer);

接下来，你可以使用`ol.Map`的`click`事件监听器来响应点击：

map.on('click', function(event) {
  var feature = event.feature; // 获取点击的特征

  if (feature) { // 如果是图标的点击
    feature.setStyle({
      stroke: true, // 添加描边
      strokeWidth: 2, // 宽度
      color: 'red', // 颜色
    });
  } else {
    feature && feature.setStyle({ stroke: false }); // 移除描边
  }
});

在这个例子中，每次点击地图时都会检查是否点击了某个图标。如果点击的是图标，则添加描边；否则，移除描边。