I need to be able to draw an arbitrarily drawn line in mapbox gl js. The line will be used to select certain points in a vector tile layer underneath the line layer. How does one do this with mapbox gl js. Will I need a custom drawn polygon so I can have full control of the points? I was thinking of using project and unproject as well as the starting point, the pixel width of the line, and the slope of the line, along with some geometry, to iterate through all visible points and get those which are underneath the line. But is there an easier way with the gl js api? QueryRenderedFeatures takes a bounding box, but this seems to be rectangular in nature as well as oriented on a north to south line. I need to be able to draw the line at any angles on the map.
You can create a custom polygon of the area surrounding your line using the turf-buffer function, and you can access the data in the vector tiles within that polygon by using queryRenderedFeatures with a bounding box that encompasses your buffered line polygon and filtering those results using turf-within to get just points that fall beneath your line.