2

I have a project where people can drag and drop a gpx file. This results in a multilinestring. People should be able to take a piece of their route and submit that. I was thinking of letting the user click two points and then taking the points in between. First problem was making the multilinestring into a linestring because people can't select something when there is a gap betwee two linestrings.

I wrote a little function to take each coordinate from each linestring in the multilinestring. I add this coordinate to a single linestring (lineSource) and as a point to another source (pointSource).

dragAndDropInteraction.on('addfeatures', function (event) {
if (event.features.length > 0) {
    let feat = event.features[0];
    if(feat.getGeometry().getType() === 'MultiLineString')
    {
        let lineStringArray = [];
        let lineStrings = feat.getGeometry().getLineStrings();
        for(let lineString = 0; lineString < lineStrings.length; lineString++){
            let linecoor = lineStrings[lineString].getCoordinates();
            for(let coor = 0; coor < linecoor.length; coor++){
                lineStringArray.push(linecoor[coor])
                pointSource.addFeature(new ol.Feature({
                    geometry: new ol.geom.Point(linecoor[coor])
                }))
            }
        }
        lineSource.addFeature(new ol.Feature({
            geometry: new ol.geom.LineString(lineStringArray)
        }));
        map.getView().fit(lineSource.getExtent());
    }
}
});

This is the result

screenshot

So far, so good. I also have a selectionLayer where the user can click on two points of the pointSource, with snapping (draw function). After they click two points, I was planning on looping over all the coordinates of the linestring and compare that coordinate with the coordinates of the two points.

As a test, I tried with the coordinates of one point

draw.on('drawend', function (e) {
  var coor = e.feature.getGeometry().getCoordinates();
  console.log(lineSource.getFeatures()[0].getGeometry().intersectsCoordinate(coor));
});

this always returns false.

returns false

I use snapping to add a point to my selectionLayer. How is that the feature from lineSource never contains the coordinate from the point in the selectionLayer? No point in looping over the coordinates from the linestring if the linestring doesn't intersect the selectionLayer What is the correct way to select points in a linestring? As far as I know, you can't add an id to a point/coordinate in a linestring

0

1 Answer 1

1

If you look at the docs for intersectCoordinate method, description says: Returns true if this geometry includes the specified coordinate. If the coordinate is on the boundary of the geometry, returns false.. Since in the case of line geometry intersection is always on the boundary (there is no interior), you get false event if the point is on the line.

The method that works in this case is intersectsExtent, which means that you check if line string geometry intersects extent of the point.

In your case it would look something like this:

draw.on('drawend', function (e) {
  var pointGeometry = e.feature.getGeometry();
  console.log(lineSource.getFeatures()[0].getGeometry().intersectsExtent(pointGeometry.getExtent()));
});
1
  • Great, this works perfect. Not sure why linestring gets a function that always returns false. I read the documentation and I assumed, in the case of linestring, it meant it wouldn't work with the start- and endpoint. I also assumed a point didn't have an extent because it's just a point. Two bad assumption lead to hours of searching. Thanks
    – kenhas
    Commented Jan 3, 2020 at 7:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.