- The provided base solution with sample data implements a single-page dashboard providing 2D “metric-vs-time” charts, and some histograms. You will keep that page as is, and add a new page to the solution. In the dashboard header you will implement a simple menu to switch between two pages. You should follow the best code practices, and refactor the code as necessary to support these two pages, and easily add new pages in future.
- The UI aspect of the new page is the following. It should contain a map view of the US, which can be switched between state-level and county-level of details, and allow to color different states / counties according to different data we want to show on the map. At county-level it should allow visualizing data for the entire US, or the selected state only. It should show pop-up tooltips when a state/county is hovered by mouse cursor (for now the tooltip displays the numeric representation of data value represented by that territory color), and redirect to different pages / URLs when different states / counties are clicked.
Under the map there will be different UI control elements allowing to switch between state-/county-levels, select, and adjust data displayed at the map, according to use case description in the following point.
- The DS aspect of the new page is the following. Assume the fatal injury & violence data are updated yearly. The user wants to see whether the last year's number of cases has a significant up-tick (spike) or down-tick (drop) compared to the previous year. He wants to see it as overall, and as per territory on state- or county-level. He further wants to see it for subsets of data, e.g. only for male injuries due to specified reason. He also wants to do similar analysis for a selected range of years (instead of the latest year) vs previous range.
For the purposes of this challenge you should go with a simple logic behind up-tick / down-tick detection. Say Ny and Ny - 1 are recorded counts of fatal injury & violence incidents queried by some selection (territory, victim sex, ethnicity, incident type, etc.) for two consecutive years (or periods, in general). For now consider only the relative change of recorded cases between these periods, i.e.
and we say the cases up- or down-ticked for that query if the absolute change is larger than 10%. When coloring the map according to the change within each territory, use the neutral beige color for territories with smaller changes, shades of red for changes larger than 10% (with red intensity increasing proportional to the growth %), and shades of green for changes below -10% (with green intensity increasing proportional to the drop %). In follow-up challenges we will introduce additional criteria and thresholds, thus write the code in a way facilitating that in future.
As the data are updated yearly, at least for the base analytics (the latest year vs previous year, and basic selections like “cause”, “only men”, “only women”, only specific ethnicity, etc.) you should pre-calculate analysis results (and thus you should create a separate script allowing that), and load pre-calculated data into UI, thus achieving fast performance for end user.
You should also implement a “combined” report / view: once you have pre-calculated for each territory the spike / drop of incidents according to different queries, you can rapidly check for each territory the query which resulted in the largest spike of cases, and color that territory according to that spike.
This challenge will be scored according to the standard code without unit-tests challenge scorecard. The major requirement is the overall implementation of the described functionality. Under the minor requirements the reviewers should score for specific narrow issues in your solution.