样式化 openlayers 绘制交互

Question

在默认的openlayers绘图交互中，没有线段连接鼠标所在的位置和终点（第一张图片）。当我设置自定义样式时，出现了这个我不想要的片段（第二张图片）。有谁知道我如何像默认样式一样消除最后一段？

Answer 1

您需要一个样式函数，它可以为点、线和多边形设置样式并根据几何类型进行区分。重要提示：多边形样式应该只有填充，而不是描边。因为多边形的边界是一个单独的线串。绘图交互的最小工作风格函数如下所示：

var styles = {
  Point: new ol.style.Style({
    image: new ol.style.Circle()
  }),
  LineString: new ol.style.Style({
    stroke: new ol.style.Stroke()
  }),
  Polygon: new ol.style.Style({
    fill: new ol.style.Fill()
  })
};
function styleFunction(feature) {
  return styles[feature.getGeometry().getType();
}