Add lasso spatial selection tool to map charts#354
Conversation
Add LassoIcon SVG and lasso toggle button to MapControls component with onLassoToggle/isLassoActive props. Wire up placeholder handlers in both the Multi map and standalone GeoSetLayer views. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Connect the lasso button in MapControls to actual state management in Multi.tsx. Clicking the lasso button now opens a dropdown listing all map layers; selecting a layer activates lasso mode for that layer. Includes styled dropdown panel with outside-click dismissal. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Bump LassoIcon SVG dimensions from 16x16 to 18x18 to improve visual consistency with other map control icons. Update wiki to document the lasso select tool in the feature comparison table. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Integrate @deck.gl-community/editable-layers for proper lasso polygon drawing, replacing placeholder wiring. Users can now switch between freehand (drag) and click-to-draw polygon modes. Multi-layer charts support checkbox-based layer selection for lasso targets. Adds MapControls unit tests. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Extract duplicated lasso state management from GeoSetLayer.tsx and Multi.tsx into a shared useLassoSelection hook. Fix escape key not exiting lasso mode in single-layer charts, and add reciprocal mode deactivation so lasso and ruler can never be active simultaneously. Replace `any` type on LassoOverlay mode state with explicit union type. Add tests for useLassoSelection (14) and useLassoLayer (7) hooks. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Wire up lasso polygon completion to filter features using Turf.js point-in-polygon queries. Both single-layer and multi-layer charts now show a results bar with feature count and export options (CSV, Excel via xlsx). Add lassoPolygon, selectedFeatures, and clearSelection state to useLassoSelection hook. Update docs with new utility files and lasso feature in README. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Keep the completed lasso polygon visible (dashed outline + fill) after drawing finishes so users can see their selection area. Reposition the results bar from bottom-center to top-left, refine its styling, and auto-clear selection after CSV/Excel export. Add debug console logging for lasso selections. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add LassoOverlay, LassoResultsBar, and useLassoSelection hook to the Key Utilities table in the Development Guide wiki page. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…ring Replace multi-layer checkbox selection with single-layer radio selection for the lasso tool. Upgrade lasso filtering from centroid-based to geometry-aware intersection — points use direct containment, polygons are selected when ≥50% of their area overlaps the lasso region via @turf/intersect. Add @turf/area, @turf/intersect, @turf/boolean-within dependencies. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…try filtering Reflect the switch from multi-layer to single-layer selection in the Development Guide and inline comments. Update lassoSelection.ts description to mention geometry-aware intersection filtering. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Position the LassoResultsBar at the screen coordinates of the last lasso polygon point instead of a fixed top-left corner. Add anchorPosition state to useLassoSelection hook, project the final polygon coordinate via WebMercatorViewport, and pass it through to both single-layer and multi-layer map components. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Fix critical memoization cascade where EditableGeoJsonLayer was reconstructed every render due to unstable onPolygonComplete references. Update useLassoSelection tests to match current single-select API. Extract LassoDropdown component, remove debug console statements, unused deps, and drifting anchor positioning. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…ored results - Add dashed stroke styling to lasso polygon and guide lines - Delay draw mode activation to prevent dropdown close click from placing a vertex - Reset drawing state when results are cleared for seamless re-lasso - Activate lasso on outside click when a layer is already selected - Anchor results bar near the end of the drawn polygon instead of fixed position - Add defaultLayerName option to auto-select preferred layer - Preserve selected layer when toggling lasso off - Rename "Freehand" mode label to "Click-and-drag" - Remove unused @turf/boolean-within dependency Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add a GeoJsonLayer overlay in DeckGLContainer that renders lasso-selected features with their original colors on top of dimmed data layers (opacity 0.15). Both Multi and GeoSetLayer pass selectedFeatures to the container. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…y support Add a configurable "Lasso Selectable" toggle to the layer settings popover, letting users control which layers appear in the lasso tool's dropdown. Also adds LineString/MultiLineString geometry support to lasso selection, prevents feature popups while lasso is active, removes the disabled "Download as image" placeholder, and simplifies default layer selection by removing the hardcoded defaultLayerName preference. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Shows contextual help text near the cursor when the lasso tool is active and no features are selected yet — "Double-click or click first point to close" for polygon mode, "Click and drag to draw selection" for freehand mode. Tooltip disappears once a selection is made or the mouse leaves the map. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Consolidate duplicated state resets into shared resetLassoState() - Fix category key normalization inconsistency between single/multi-layer views - Fix CSV formula injection by guarding =, +, -, @ prefixes in escapeCSV - Fix MapControls tests to match actual "Click-and-drag" label - Fix handleLassoToggle to clear selectedLassoLayerId (matching test intent) - Suppress feature click popups during lasso mode in GeoSetLayer - Guard against setState-on-unmount in Excel export async handler - Extract DASH_PROPS constant in LassoOverlay (eliminates 4x duplication) - Simplify Multi.tsx to call filterFeaturesInLasso directly (single-layer) - Remove redundant count prop from LassoResultsBar - Stabilize selectedFeaturesArr reference in DeckGLContainer with useMemo - Remove unnecessary transitive deps from root package.json - Add unit tests for lassoSelection.ts and lassoExport.ts (22 new tests) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Split useLassoSelection into focused useLassoActivation and useLassoResults sub-hooks. Extract useClickOutside to deduplicate outside-click handling. Consolidate SVG icons into shared icons.tsx. Replace magic color/timing values with named constants. Cache XLSX dynamic import. Add console.warn to silent catch blocks and expand test coverage for Polygon/MultiLineString geometry types. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Fix auto-select bug after toggle cycle by adding resetCount dep - Extract shared buildLassoResult helper to deduplicate onPolygonComplete - Remove dead code (filterMultiLayerFeaturesInLasso, LassoSelectionResult) - Add categoryName/strokeColor to GeoJsonFeature type (remove as-any casts) - Fix LassoOverlay race condition with drawModeRef during activation delay - Fix CSV formula guard to skip numeric values like -5.2 - Normalize highlight layer colors to 4-element RGBA arrays - Combine duplicate @deck.gl/layers imports in LassoOverlay Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…rove lasso code Normalize category keys in Multi.tsx when building hiddenCategoryKeys so hidden categories are correctly filtered during multi-layer lasso selection. Replace xlsx (CVE-2023-30533) with exceljs for Excel export. Extract shared fullReset in useLassoSelection, stabilize useClickOutside with a callback ref, add explanatory comments for eslint-disable, and use CloseIcon in LassoDropdown. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…racy Add circle and rectangle as new lasso shape options alongside freehand and polygon. Improve line/multiline selection using geometric intersection instead of vertex-only checks, handle self-intersecting freehand polygons via unkinkPolygon, and batch async filtering to avoid UI freezes on large datasets. Store the results-bar anchor as a geo coordinate so it tracks pan/zoom. Persist draw mode to sessionStorage, add ARIA attributes for accessibility, harden Excel export against formula injection, and add LassoDropdown and LassoResultsBar test coverage. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…x hook ordering Remove Object.freeze from EMPTY_FEATURE_COLLECTION to avoid mutation conflicts with nebula.gl, suppress edit layer tooltips, and reorder anchorPosition useMemo to correct hook dependency placement. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Change handleLassoToggle to only deactivate and clear results instead of doing a full reset, so the user's layer selection is retained. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Remove unused `style` variable in LassoResultsBar test and add explicit type annotations for `mockLayerCalls` and `props` in useLassoLayer test. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Cast d.position through unknown before asserting as Position, since number[] is not directly assignable to readonly [number, number]. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Show success/error toasts via useToasts when exporting lasso selections, replacing silent console.error handling. Add test coverage for all four toast scenarios. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Switch back to xlsx for lazy-loaded Excel export in the lasso tool. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Empty selection leaves you stuckDrawing a shape that selects 0 features gives no results bar to dismiss and no way to redraw — have to toggle lasso off and back on. Should auto-reset to draw mode on 0 results or show a "0 selected" bar that can be cleared, this may be expected behavior but seems annoying. Can't pan after selectionTest plan says "pan/zoom after selection, verify results bar follows polygon" — but Export includes internal fieldsCSV/Excel export leaks internal property keys ( Results bar is cut off
|
- Clamp results bar within map bounds and flip menu when near edge - Re-enable map panning after lasso drawing completes - Use live viewport for anchor projection so bar tracks pan/zoom - Show results bar with "0 Items Selected" when polygon drawn but no features matched; hide export menu when count is zero - Filter internal layer properties (fillColor, strokeColor, etc.) from CSV/Excel exports - Add type declarations for turf and editable-layers packages - Make toast callbacks optional props instead of using useToasts hook Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
@jmeegan2 I made updates to fix those issues you found. I addressed each one. |
Only render LassoResultsBar when anchorPosition is computed to prevent flash at (0,0). Run spatial filtering synchronously for datasets up to 5000 features to eliminate async overhead; batch with yields above that. Extract prepareLassoPolygons helper for clarity. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…orts Add isInternalKey helper that checks both the static INTERNAL_KEYS set and color_ prefixed keys generated by layer processing. Add pointSize to the exclusion list. Formatting cleanup in escapeCSV. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Build exportColumnNames in transformProps from dimension, hover, feature info, color-by, point-size, and text-label columns. Pass allowlist through to LassoResultsBar and export utilities so only raw data columns appear in CSV/Excel output. Falls back to all properties when no allowlist is available. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…lumns Pass toast callbacks as props instead of mocking useToasts hook. Update export assertions to include the new allowedColumns parameter. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Remove dimension, colorByValue, pointSize, and textLabel from export columns — users only need data columns, not rendering config inputs. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add a Lasso Select Tool section to GeoSet Map Layer with usage steps, draw modes, selection behavior by geometry type, export column details, and per-layer config. Add a shorter reference section to GeoSet Multi Map. Update Development Guide to note the export allowlist. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Display calculated area (acres/sq mi) on the lasso results bar and replace prop-based toast callbacks with antd's built-in message API for simpler, self-contained export notifications. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
Add lasso area size ti items selected panel |
Hide hover tooltips while lasso mode is active to prevent them from flickering over the drawing surface. Clear any visible tooltip on lasso activation. Also bump the activation delay from 300ms to 450ms to better prevent the dropdown-close click from placing a vertex. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>




Summary
lassoSelectableadmin config toggle@turf/unkink-polygonsessionStorageacross activationsFocus Score
8/10 — All changes serve the single goal of adding the lasso selection tool. The slight breadth comes from necessarily touching integration points (
DeckGLContainer.tsx,Multi.tsx,GeoSetLayer.tsx,DeckSlicesControl) and adding shared infrastructure (hooks, types, utilities) that the feature depends on. Wiki and documentation updates are scoped to the lasso feature.Detailed Summary of Each File Changed
New Source Files
src/components/useLassoLayer.ts@deck.gl-community/editable-layersfor draw interaction + completed polygon display layerssrc/components/LassoDropdown.tsxsrc/components/LassoResultsBar.tsxsrc/components/icons.tsxsrc/hooks/useLassoActivation.tssrc/hooks/useLassoResults.tssrc/hooks/useLassoSelection.tssrc/hooks/useClickOutside.tssrc/utils/lassoSelection.tsfilterFeaturesInLassowith unkink + sync/async batching),buildLassoResult,handleLassoPolygonComplete,projectAnchorToScreen,normalizeCategoryKeysrc/utils/lassoExport.tsexportToCSV/exportToExcel(lazy-loaded xlsx) with allowlisted columns and formula injection protectionModified Source Files
src/DeckGLContainer.tsxsrc/GeoSetMultiMap/Multi.tsxuseLassoSelectionhook, passes lasso props to MapControls/DeckGLContainer/LassoResultsBar, computes export column allowlist per layer, uses live viewport for anchor projectionsrc/layers/GeoSetLayer/GeoSetLayer.tsxsrc/components/MapControls.tsxtypes.tssrc/GeoSetMultiMap/multiUtils.tslassoSelectablefield to normalized deck slice configsrc/transformProps.tsexportColumnNamesallowlist from Hover Data + Feature Info columnssrc/types.tsLassoDrawModeandLassoLayertype definitionssrc/declarations.d.ts@deck.gl-community/editable-layersDeckSlicesControl/index.tsxlassoSelectabletoggle checkbox to the admin slice configuration panelpackage.json@turf/area,@turf/boolean-intersects,@turf/boolean-point-in-polygon,@turf/centroid,@turf/helpers,@turf/intersect,@turf/unkink-polygon,@deck.gl-community/editable-layersNew Test Files
test/components/LassoDropdown.test.tsxtest/components/LassoResultsBar.test.tsxtest/components/useLassoLayer.test.tstest/components/MapControls.test.tsxtest/hooks/useLassoActivation.test.tstest/hooks/useLassoResults.test.tstest/hooks/useLassoSelection.test.tstest/utils/lassoSelection.test.tstest/utils/lassoExport.test.tstest/GeoSetMultiMap/multiUtils.test.tslassoSelectablenormalization testDocumentation
wiki/GeoSet-Map-Layer.mdwiki/GeoSet-Multi-Map.mdwiki/Development-Guide.mdwiki/Home.mdREADME.mdTest Plan
'🤖 Generated with Claude Code