diff --git a/app/ptxboa_functions.py b/app/ptxboa_functions.py
index a4b7c33d..79ef48d2 100644
--- a/app/ptxboa_functions.py
+++ b/app/ptxboa_functions.py
@@ -232,37 +232,71 @@ def create_sidebar(api: PtxboaAPI):
def create_world_map(settings: dict, res_costs: pd.DataFrame):
- parameter_to_show_on_map = st.selectbox(
- "Select cost component:", res_costs.columns, index=len(res_costs.columns) - 1
- )
+ """Create world map."""
+ parameter_to_show_on_map = "Total"
+
+ # define title:
title_string = (
f"{parameter_to_show_on_map} cost of exporting {settings['chain']} to "
f"{settings['country']}"
)
- # Create a choropleth world map using Plotly Express
+ # define color scale:
+ color_scale = [
+ (0, "rgb(60, 194, 204)"), # Starting color at the minimum data value
+ (1, "rgb(208, 110, 162)"), # Ending color at the maximum data value
+ ]
+
+ # Create custom hover text:
+ custom_hover_data = res_costs.apply(
+ lambda x: f"{x.name}
"
+ + "
".join(
+ [
+ f"{col}: {x[col]:.1f} {settings['output_unit']}"
+ for col in res_costs.columns[:-1]
+ ]
+ + [
+ f"──────────
{res_costs.columns[-1]}: "
+ f"{x[res_costs.columns[-1]]:.1f} {settings['output_unit']}"
+ ]
+ ),
+ axis=1,
+ )
+
+ # Create a choropleth world map:
fig = px.choropleth(
locations=res_costs.index, # List of country codes or names
locationmode="country names", # Use country names as locations
color=res_costs[parameter_to_show_on_map], # Color values for the countries
- hover_name=res_costs.index, # Names to display on hover
- color_continuous_scale="Turbo", # Choose a color scale
- title=title_string,
+ custom_data=[custom_hover_data], # Pass custom data for hover information
+ color_continuous_scale=color_scale, # Choose a color scale
+ title=title_string, # set title
)
- # Add black borders to the map
+ # update layout:
fig.update_geos(
showcountries=True, # Show country borders
- showcoastlines=False, # Hide coastlines for a cleaner look
- bgcolor="lightgray", # Set background color
- countrycolor="white", # Set default border color for other countries
- showland=True,
- landcolor="white", # Set land color
- oceancolor="lightblue", # Set ocean color
+ showcoastlines=True, # Show coastlines
+ countrycolor="black", # Set default border color for other countries
+ countrywidth=0.2, # Set border width
+ coastlinewidth=0.2, # coastline width
+ coastlinecolor="black", # coastline color
+ showland=True, # show land areas
+ landcolor="#f3f4f5", # Set land color to light gray
+ oceancolor="#e3e4ea", # Optionally, set ocean color slightly darker gray
+ showocean=True, # show ocean areas
+ framewidth=0.2, # width of frame around map
+ )
+
+ fig.update_layout(
+ coloraxis_colorbar={"title": settings["output_unit"]}, # colorbar
+ height=600, # height of figure
+ margin={"t": 20, "b": 20, "l": 20, "r": 20}, # reduce margin around figure
)
- fig.update_layout(coloraxis_colorbar={"title": settings["output_unit"]})
+ # Set the hover template to use the custom data
+ fig.update_traces(hovertemplate="%{customdata}") # Custom data
- # Display the map using st.plotly_chart
+ # Display the map:
st.plotly_chart(fig, use_container_width=True)
return
@@ -365,11 +399,11 @@ def content_dashboard(api, res_costs: dict, context_data: dict, settings: pd.Dat
"""
)
- c_1, c_2 = st.columns([1, 2])
- with c_1:
+ c_1, c_2 = st.columns([2, 1])
+ with c_2:
create_infobox(context_data, settings)
- with c_2:
+ with c_1:
create_world_map(settings, res_costs)
st.divider()