0

在修改http://jsfiddle.net/CPRam/egn1kmc8/上找到的参考链接后，我通过在 openlayer v5.2 中使用具有不同宽度笔划的单要素对象的样式几何选项在地图上生成了平行线串。

在样式函数中使用带有调用函数的几何图形时，我没有在样式的单击事件中获取几何图形。因此，为此，我删除了调用函数并给出了具有平行距离的固定分辨率。

因此，现在在“单击”事件中，我能够获得具有所有样式及其几何形状的功能。但在里面map.on('singleclick',function(event){})...。如何区分点击哪条线或几何图形。

我尝试单击事件点是否与线相交但没有成功然后我在这里理解问题是我单击 Stroke not on Line 因为单击事件像素点也无法与是否与线相交

具有多几何样式的单个特征的图像：

具有多几何样式的单特征图像

即使我尝试了 turf.js pointToLineDistance() 但由于动态宽度和线坐标差异在我的逻辑中没有得到正确的线串。

我谷歌但没有得到任何解决方案来获取在地图上单击哪种样式几何（线）。请参阅上面的代码jsFiddler参考链接

通过任何事件来获得单击哪个 lineString 的任何帮助。

4

1 回答 1

1

单击不太可能与任何线串完全相交，但您可以getClosestPoint()在每个几何图形上使用该方法来查找最接近的线串：

map.on('singleclick',function(event){
  var coordinate = event.coordinate;
  console.log('singleclick');
  var feature = map.forEachFeatureAtPixel(event.pixel, function(feature){return feature});
  if (feature) {
    var closestGeom;
    var closestDistSq = Infinity;
    var resolution = map.getView().getResolution();
    var styles = styleFunction(feature, resolution);
    styles.forEach(function(style){
      var geomFn = style.getGeometryFunction();
      if (geomFn) {
        var geom = geomFn(feature);
      } else {
        var geom = feature.getGeometry();
      }
      var closestPoint = geom.getClosestPoint(coordinate);
      var distSq = Math.pow(closestPoint[0]-coordinate[0],2)+Math.pow(closestPoint[1]-coordinate[1],2);
      if (closestDistSq > distSq) {
        closestDistSq = distSq;
        closestGeom = geom;
      }
    });
    console.log(closestGeom.getCoordinates());
  }
});
于 2019-03-24T11:39:58.113 回答