Closed NealHumphrey closed 7 years ago
The DC Action for Children example above ("choose a dataset functionality on this tool") has a pullout sidebar. The Disaster Operations map that @rmcarder is working on just implemented similar functionality. [This commit]((https://github.com/ccusa/Disaster_Vulnerability_Map/pull/36/files) got the sidebar open/close navigation working. If we go with a similar 'slide open sidebar' for choosing data sources, we can use this to draw some code from to jump start it.
From Chris: current version https://github.com/ccusa/Disaster_Vulnerability_Map/pull/36/files
Note, this is the current action items on this issue: https://github.com/codefordc/housing-insights/issues/289
At last week's meeting, we discussed making the Filter method (for choosing individual buildings) and the Browse method (for viewing city-wide data sets that are not buildings) into one unified view. To make this happen, we need a 'good enough' implementation plan about how to start building this unified page. The Javascript team members will need an overall layout and initial set of core design elements right away - no later than May 16th. We can continue refining the components after that point, providing them to the JS team as we go.
Core functionality for a unified data exploration page based on the current map view:
Apply data filters to buildings
Use this list of initial data fields.
This requires 3 categories of filter UI components:
Clear path to adding more data sources.
Select a zone type (ward, zip, etc.) and a data set from a large list of data sources, which are displayed as a chloropleth. Behavior is like the 'choose a dataset' functionality on this tool but with the added choice of zone type.
Clearly display which chloropleth data set is chosen
Clearly display which filter criteria have been applied
Display a dataset specific legend for the chloropleth data
Display a legend indicating the meaning of color coding of dots on the map (i.e. buildings)
Sidebar snapshot view - some sort of summary statistics/graphs/comparisons.
Any mobile responsiveness needs to follow simple Bootstrap grid system rules that can be applied to appropriate design sections.
Design tradeoffs: