Water Level Page

[Adelle-Pitsas]

Tasks

Preview Give feedback

1. Add new page "Water Level"
2. Mimic layout to what currently exists in Mariners and what was sketched out
3. Add forecast data to chart
4. Pull in preliminary data into a chart
5. Add standard references in graph (I don't fully know what these are and should be yet)
6. Add ability to switch datums (2nd iteration of project)
7. Add custom date picker (via Highcharts or native HTML)
8. Radio buttons to change datum instead of dropdown
9. Link water level page in platform page when there is a relevant water level page
10. Make sure its easily viewable on mobile #2808
    +0
    
11. More info on graph under title
12. Move selectors to sidebar #2809
    +0
    

[youngmorse]

Since the WL product requirements are starting coalesce in the CIVIC Box folder I'll just add a few more links vs. recreating so we don't have to update in more than one place. Hannah made a V2 of the Product Requirements doc to outline basic functionality for both the NERACOOS/Mariners viewer and the EcoINet viewer: CIVIC WL Products

Somewhere in that doc is a link to 'data sources' which is a Google sheet where I started compiling the info on the gauges/sensors - including the benchmark references for flooding levels that will end up on the charts: Google Sheet w/Sensor Info

Revised sketch up of product:

An example on NOAA Inundation Dashboard of a chart (also in HighCharts!) that shows the benchmarks for flooding levels:

[tshyka]

Thanks for sharing these docs. Can you provide access to the CIVIC Box folder?

[youngmorse]

Hi Tom, I don't think I can't share the Box links because you are outside of GMRI but I'll send it to you. It's a cleaned up version of our WL product requirements from Google Docs.

[Adelle-Pitsas]

There has been discussion about how and where different selectors are located and displayed. There have been a few iterations of this and screenshots can be found in #2803 and in PR #2811. In addition to the layout changes in these screenshots, the datum selection was moved from a dropdown to a radio button group. There was also discussion of the datum selection being a button group.
Examples of each selector style:
Dropdown:

Radio group:

Button group:

[youngmorse]

I've been finding a few bugs while adding sensors. I'm adding them as comments w/detail then they can go up to the task list or promoted to new issues if needed.

• The y-axis range is really big, it's more noticeable on the sensors with the smaller ranges. It does appear to be scaling dynamically but the range is too big.

[youngmorse]

• Unit system selection reverts back to English from Metric when you change stations or change time range. Works okay with Datum selection change (hard to show in a screen shot but easy to replicate!)

[youngmorse]

A couple of timeframe date select bugs (Firefox)

• If you change the time range it retains the setting if you change platforms on that page. The URL stays the same as the selected range. Refreshing the browser doesn't reset to the default range, you have to click the 'Water Level' link in the menu and select a station to reset the range. (My first movie was too big to upload but shows the behavior a little more clearly.)

Screen.Recording.2024-04-12.at.4.51.48.PM.mov

• If you use the calendar option the dates change fine. If you try to type a new date the fields disappear!

Screen.Recording.2024-04-12.at.4.50.38.PM.mov

[youngmorse]

These two are related to the marker status if flood levels are detected:

• On the Water Level landing page, the flood marker color doesn't change for CASM1 to show Moderate but the tooltip shows that it's moderate. It did change to show markers with Action level for stations further south (CT)

• This shows the CASM1 station detail page does change color for moderate flooding. (note: I temporarily lowered the flood benchmarks at this station to show a moderate flood level)

[youngmorse]

These next few are enhancements not bugs...

New features/behaviors:

• Add vertical line to show current time on plot

Changes to current features/behavior (open to discussion)

• Default time is GMT - do we want to convert to EST?

• For stations with not a lot of difference in benchmarks, it's hard to see the difference in the two levels. the https://water.noaa.gov has this problem too, so it may be a tough one to solve.

• For stations that have a lot of additional data do we want to limit what we show in the station info? Noticed this on a station that had 6-7 variables.