Exercise

A dropdown for sales by country

As you were working away at your desk, the global sales manager for the global e-commerce company visited with a new data viz challenge. She noted that the recent sales graphs you produced were interesting, but she wanted to be able to filter and focus on only one country at a time and see the category aggregation data update.

You gladly accept the challenge, comforted that your expertise in Dash callbacks will be just the thing to breathe some interactive life into your Dash app.

The manager noted that it is important to use the corporately approved, abbreviated country names in the dropdown:

UK = United Kingdom, GM = Germany, FR = France, AUS = Australia, HK = Hong Kong.

Instructions

100 XP
  • Add a dropdown component with an identifier of country_dd below line 22 so it can be linked to the callback.
  • Set the dropdown options to the Country names (in this order: UK = United Kingdom, GM = Germany, FR = France, AUS = Australia, HK = Hong Kong) such that the abbreviation is visible to the end-user, but the full name is passed to the callback below line 24.
  • Add a component that will render a Plotly figure with an identifier of major_cat below line 35 so it can be linked to the callback.
  • Set the input and output of the callback to link the dropdown to the graph component below lines 47 and 49.