Skip to content

Design and Implement Functional Navbar for Atlas #42

Description

@Itz-Agasta

The Atlas project needs a well-structured and highly functional navigation/filter sidebar (navbar) that enables users to efficiently explore and analyze Argo float data on the map.

The goal is to provide scientists and users with intuitive tools to filter, select, and overlay data without cluttering the main visualization area.

A proposed layout and feature grouping is attached to this issue for reference.

Objectives

Build a collapsible navbar that supports:

1. Platform ID Search

  • Input field to search by 7-digit WMO Platform ID
  • Primary method for locating specific instruments
  • Instant filtering on valid ID input

2. Time Period Selection

  • Preset ranges: 7D, 30D, 5Y, 10Y, ALL (default: ALL)
  • Slider synced with presets
  • Custom date range picker (start/end dates)

3. Selection Tools

Map interaction tools including:

  • Polygon / Lasso tool to select floats inside drawn region
  • Transect tool to draw a line and generate vertical cross-section view
  • EEZ boundary toggle to restrict data within Exclusive Economic Zones

4. Filtering Panels

Each filter should show live counts based on current selection.

Status Filter (default: ALL):

  • All
  • Active
  • Inactive

Network Filter (default: all selected):

  • BGC Argo
  • Core Argo
  • Deep Argo

5. Overlay Controls (default: all OFF)

Map overlays for contextual comparison:

  • Bathymetry (ocean floor topography)
  • Sea Surface Temperature (SST) satellite overlay
  • Salinity gradient heatmaps generated from float data

UX Expectations

  • Filters should update map results in real time
  • Counts must reflect active dataset after each filter change
  • Navbar should be responsive and collapsible on smaller screens
  • Clear visual separation between sections (Search, Time, Tools, Filters, Overlays)

Acceptance Criteria

  • All UI controls are wired to actual map filtering logic
  • Selection tools correctly interact with the map layer
  • Overlay toggles dynamically load and unload map layers
  • Filter counts update based on current dataset state
  • Works smoothly without blocking map rendering

Reference

Image

NOTE: Overlay Controls & Selection Tools backend will be implemented later after we launch Atlas v1.0.0... so add proper todos there

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions