-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add watershed information table #407
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice job. Great testing. (Isn't it amazing how more than half the effort of development is in creating tests?)
A couple of thoughts about the UI:
- Is it possible to change the hint popup on the circle marker in the map toolbar to read something like "Select a point on the map"? I recall looking into this for some other map tool, but can't remember if it proved intransigent. Alternatively, change the prompt in the unselected state to read "Select a point on the map, using the circle marker tool, to see watershed information."
- The watershed information is great. May I suggest making it more explicit that the watershed in question is the one draining to the selected point? So maybe a change to the heading of the table, and/or revising the label of the Area and Melton Ratio params to be explicit about this?
} | ||
} | ||
|
||
export default AttributeValueTable; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Totally minor: You can fold this into the class defn above: export default class ...
.
import styles from './WatershedSummaryTable.module.css'; | ||
|
||
|
||
// TODO: Use `withAsyncData` to factor out common data-fetching code here |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do you feel like trying this? Only if you have time.
These are both great UI suggestions, thanks!
It definitely seems like it should be possible to set a custom tooltip - "Draw a circlemarker" isn't very intuitive - but my efforts have come to naught. I updated the table text instead, as you suggested.
Done, thanks! |
This PR addresses a UI issue with the new streamflow portal. The streamflow portal has the user click on a single point on the map (streamflow does not make sense averaged across an area) but it can be difficult for the user to tell whether they have indeed clicked on the point they're interested in; the UI doesn't offer any feedback. These changes add a table showing some information about the watershed that drains to the point the user clicked on: the latitude and longitude of the selected point (from the map) and information provided by the
watershed
API: the area of the watershed that drains to that point, highest and lowest elevations, and the Melton ratio.Changes:
AttributeValueTable
, a table that will display a collection of objects withattribute
,value
andunits
membersWatershedSummaryTable
, a component that queries thewatershed
backend for data and passes it to anAtributeValueTable
getWatershed()
andgetWatershedGeographyName()
ince-backend.js
for querying the watershed APIvalidateWatershedData()
andparseWatershedTableData()
inutil.js
for checking the API response and formatting it into attribute/value/unit objects for the tableDemo.
Resolves #405