To improve the user experience of selecting LineString alerts by adding a buffer for mouse events, and to fix the placement of pulsing circles for recent alerts, which was previously set to work with a bounding box of a polygon only.
What I changed
In addPulsingCircles, we now calculate the center of the pulsing circle based on the feature's geometry. In addition to Polygons (which was the existing behavior), for LineStrings we are now using several turf methods to calculate the midpoint of the length of a line, and for Points we are using the point lat/long directly.
Extracted logic for feature selection into its own method selectFeature for tidiness and re-usability.
Track if alerts have LineStrings with a new state variable hasLineStrings, and set this value when the data is added in addDataToMap
When hasLineStrings is true, we attach two event listeners which invoke handleBufferMouseEvent and handleBufferClick.
These two methods update the mouse to a pointer when it's within 10px of the LineString, and trigger selectFeature for clicks within this buffer zone
Goal
To improve the user experience of selecting LineString alerts by adding a buffer for mouse events, and to fix the placement of pulsing circles for recent alerts, which was previously set to work with a bounding box of a polygon only.
What I changed
addPulsingCircles
, we now calculate the center of the pulsing circle based on the feature's geometry. In addition to Polygons (which was the existing behavior), for LineStrings we are now using severalturf
methods to calculate the midpoint of the length of a line, and for Points we are using the point lat/long directly.selectFeature
for tidiness and re-usability.hasLineStrings
, and set this value when the data is added inaddDataToMap
hasLineStrings
is true, we attach two event listeners which invokehandleBufferMouseEvent
andhandleBufferClick
.selectFeature
for clicks within this buffer zone