Skip to content

Commit

Permalink
Merge pull request #14 from dataforgoodfr/global_dashboard
Browse files Browse the repository at this point in the history 
Improvement of hover texts and correction of map bugs
  • Loading branch information
@benoitfrisque
benoitfrisque authored Nov 14, 2024
2 parents 99ae859 + d0ec544 commit a50aca6
Show file tree
Hide file tree
Showing 5 changed files with 64 additions and 69 deletions.
52 changes: 25 additions & 27 deletions dashboard/app.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
from dash.dependencies import State
from dash.exceptions import PreventUpdate
from dash_iconify import DashIconify
from dotenv import load_dotenv
import dash_mantine_components as dmc

from my_data.datasets import get_useful_data
Expand All @@ -32,7 +33,12 @@
LICHEN_IMG_DIR = os.path.join('assets', 'img')
BLANK_FIG = blank_figure()

lang = 'fr'
load_dotenv()
lang = os.getenv('lang', 'fr')

if lang not in ['fr', 'en']:
raise ValueError('lang must be either "fr" or "en"')


# Fetch datasets
print("Fetching data...")
Expand Down Expand Up @@ -111,15 +117,15 @@ def get_selected_address(observation_clicked):
Input('map-nb_species-vdl', 'clickData'),
State('map-nb_species-vdl', 'relayoutData')
)
def update_map(date_range, map_column_selected, map_style, clickData, relayoutData):
def update_observation_map(date_range, map_column_selected, map_style, clickData, relayoutData):
if None in date_range:
raise PreventUpdate

filtered_observation_df = get_filtered_observation_df(date_range)

if relayoutData and 'mapbox.zoom' in relayoutData and 'mapbox.center' in relayoutData:
current_zoom = relayoutData['mapbox.zoom']
current_center = relayoutData['mapbox.center']
if relayoutData and 'map.zoom' in relayoutData and 'map.center' in relayoutData:
current_zoom = relayoutData['map.zoom']
current_center = relayoutData['map.center']
else:
current_zoom = 4.8
current_center = {
Expand Down Expand Up @@ -204,17 +210,17 @@ def update_gauge_hist_pie(date_range, clickData):
Input('map-species-style-dropdown', 'value'),
State('map-species_present', 'relayoutData')
)
def update_map(species_id_selected, map_style, relayoutData):
def update_species_map(species_id_selected, map_style, relayoutData):
if isinstance(species_id_selected, str):
species_id_selected = int(species_id_selected)

observation_with_selected_species_col_df['selected_species_present'] = observation_df['observation_id'].isin(
lichen_df.loc[lichen_df['species_id'] == species_id_selected, 'observation_id']
)

if relayoutData and 'mapbox.zoom' in relayoutData and 'mapbox.center' in relayoutData:
current_zoom = relayoutData['mapbox.zoom']
current_center = relayoutData['mapbox.center']
if relayoutData and 'map.zoom' in relayoutData and 'map.center' in relayoutData:
current_zoom = relayoutData['map.zoom']
current_center = relayoutData['map.center']
else:
current_zoom = 4.8
current_center = {'lat': observation_with_selected_species_col_df['localisation_lat'].mean() + 0.5, 'lon': observation_with_selected_species_col_df['localisation_long'].mean()}
Expand Down Expand Up @@ -352,8 +358,8 @@ def histogram_card(title, tooltip_text, graph_id, height='330px'):
dmc.Card(
children=[
title_and_tooltip(
title=get_translation('map_title', lang),
tooltip_text=get_translation('map_tooltip', lang)
title=get_translation('observation_map_title', lang),
tooltip_text=get_translation('observation_map_tooltip', lang)
),
dmc.SegmentedControl(
id='map-column-select',
Expand All @@ -372,28 +378,24 @@ def histogram_card(title, tooltip_text, graph_id, height='330px'):
children=[
dmc.Select(
id='map-style-dropdown',
value='streets', # Default value
placeholder=get_translation('map_style_selector', lang),
data=[
{'label': 'Streets',
'value': 'streets'},
{'label': 'OpenStreetMap',
'value': 'open-street-map'},
{'label': 'Satellite',
'value': 'satellite'},
{'label': 'Satellite with streets',
'value': 'satellite-streets'},
{'label': 'Dark',
'value': 'dark'},
],
clearable=False,
clearable=True,
allowDeselect=False,
searchable=False,
style={
'position': 'absolute',
'top': '15px',
'left': '15px',
'zIndex': '1000',
'width': '200px',
'zIndex': '1',
'width': '150px',
'opacity': '0.8'
}
),
Expand Down Expand Up @@ -629,28 +631,24 @@ def histogram_card(title, tooltip_text, graph_id, height='330px'):
children=[
dmc.Select(
id='map-species-style-dropdown',
value='streets', # Default value
placeholder=get_translation('map_style_selector', lang),
data=[
{'label': 'Streets',
'value': 'streets'},
{'label': 'OpenStreetMap',
'value': 'open-street-map'},
{'label': 'Satellite',
'value': 'satellite'},
{'label': 'Satellite with streets',
'value': 'satellite-streets'},
{'label': 'Dark',
'value': 'dark'},
],
clearable=False,
clearable=True,
allowDeselect=False,
searchable=False,
style={
'position': 'absolute',
'top': '15px',
'left': '15px',
'zIndex': '1000',
'width': '200px',
'zIndex': '1',
'width': '150px',
'opacity': '0.8'
}
),
Expand Down
19 changes: 10 additions & 9 deletions dashboard/assets/locale/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,23 @@
"observation_tab_title": "Sites",
"observation_tab_tooltip": "Click on a site to discover what lichens can teach us.",
"species_tab_title": "Species",
"map_title": "Observation Map",
"map_tooltip": "Click on a point to display observation details",
"map_style_selector": "Map",
"observation_map_title": "Observation Map",
"observation_map_tooltip": "Zoom and click on a point to display observation details",
"species_number_distribution_hist1_title": "Species Count Distribution",
"species_number_distribution_hist1_tooltip": "The number of lichen species (or diversity) reflects environmental quality. Generally, more species indicate less pollution. Select a site on the map to see its position (red line) relative to other Lichens GO records (blue bars).",
"vdl_distribution_hist2_title": "Lichen Diversity Value Distribution",
"vdl_distribution_hist2_tooltip": "The LDV (lichen diversity value) measures the abundance of lichens at a site. This abundance corresponds to the number of squares in which a species is present. A high LDV suggests less pollution, but other environmental factors such as climate can also influence this index. It is therefore important to consider the ecology of the species present by looking at other indicators, such as the presence of toxitolerant species. Select a site to see its position (red line) compared to other Lichens GO records (blue bars).",
"species_distribution_hist3_title": "Observed Species",
"species_distribution_hist3_tooltip": "This chart shows the percentage of squares where each species was observed on the selected site.",
"species_distribution_hist3_tooltip": "This chart shows the percentage of squares of the grid where each species was observed on the selected site.",
"thallus_pie_chart_title": "Thallus Type",
"thallus_pie_chart_tooltip": "This chart illustrates the number of fruticose, foliose, and crustose lichens observed at the selected site.",
"thallus_pie_chart_tooltip": "This chart shows the proportions (in terms of the number of squares) of foliose, crustose, and fruticose lichens observed at the selected site.",
"toxitolerance_gauge_title": "Toxitolerant Species (%)",
"toxitolerance_gauge_tooltip": "This indicator shows the proportion of toxitolerant species at the site. Toxitolerant species are generally tolerant to air pollution. They are mainly found in highly disturbed urban environments. Generally, the higher their proportion at a site, the more it is affected by human activities.",
"eutrophication_gauge_title": "Eutrophic Species (%)",
"eutrophication_gauge_tooltip": "This indicator shows the proportion of eutrophic species at the site. Eutrophic species are favored by pollution enriched with nitrogen nutrients, mainly related to urban traffic and rural agriculture. A high proportion of eutrophic species often indicates ecological imbalance, signaling that the site is heavily affected by this form of pollution.",
"acidity_gauge_title": "Acidophilic Species (%)",
"acidity_gauge_tooltip": "Acidophilic species are favored by acidic pollution. However, this type of pollution has practically disappeared from our cities. Therefore, currently, acidophilic species are rather indicators of an absence of eutrophic pollution.",
"acidity_gauge_tooltip": "Acidophilic species are favored by acidic pollution. However, this type of pollution has practically disappeared from our cities. Currently, acidophilic species are rather indicators of an absence of eutrophic pollution.",
"species_presence_map_title": "Selected Species Presence Map",
"species_presence_map_tooltip": "This map illustrates the distribution of lichen species based on the records of Lichens GO participants.",
"species_distribution_hist4_title": "Most Observed Species",
Expand All @@ -33,10 +34,10 @@
"species_description3": "in urban environment",
"nb_species_cat": "Species count",
"nb_species": "Species count",
"VDL_cat": "VDL",
"VDL": "VDL",
"VDL_cat": "LDV",
"VDL": "LDV",
"VDL_long": "Lichen Diversity Value",
"VDL_desc": "Lichen Diversity Value (VDL)",
"VDL_desc": "Lichen Diversity Value (LDV",
"deg_toxitolerance_cat": "Toxitolerant species (%)",
"deg_toxitolerance": "Toxitolerant species (%)",
"deg_eutrophication_cat": "Eutrophic species (%)",
Expand All @@ -63,7 +64,7 @@
"observation_date": "observation date",
"selected_species_present": "selected species present",
"percentage": "percentage",
"percentage_quadrats": "% of quadrats",
"percentage_quadrats": "% of squares",
"nb_observations": "sites count",
"très commun": "very common",
"rare": "rare",
Expand Down
11 changes: 6 additions & 5 deletions dashboard/assets/locale/fr.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,17 @@
"observation_tab_title": "Sites",
"observation_tab_tooltip": "Cliquez sur un site pour découvrir ce que les lichens peuvent nous apprendre.",
"species_tab_title": "Espèces",
"map_title": "Carte des observations",
"map_tooltip": "Cliquer sur un point pour afficher les informations de l'observation",
"map_style_selector": "Carte",
"observation_map_title": "Carte des observations",
"observation_map_tooltip": "Zoomez et cliquez sur un point pour afficher les informations de l'observation",
"species_number_distribution_hist1_title": "Distribution du nombre d'espèces",
"species_number_distribution_hist1_tooltip": "Le nombre d'espèces (ou diversité) des lichens reflète la qualité de l'environnement. En règle générale, plus il y a d'espèces, moins le site est pollué. Sélectionnez un site sur la carte pour voir sa position (ligne rouge) par rapport aux autres relevés Lichens GO (barres bleues).",
"vdl_distribution_hist2_title": "Distribution de la valeur de diversité lichénique",
"vdl_distribution_hist2_tooltip": "La VDL (valeur de diversité lichénique) mesure l'abondance des lichens sur un site. Cette abondance correspond au nombre de carrés dans lesquels une espèce est présente. Une VDL élevée suggère moins de pollution, mais d'autres facteurs environnementaux comme le climat peuvent influencer cet indice. Il est donc important de considérer l'écologie des espèces présentes en s'intéressant à d'autres indicateurs, tels que la présence d'espèces toxitolérantes. Sélectionnez un site pour voir sa position (ligne rouge) par rapport aux relevés Lichens GO (barres bleues).",
"species_distribution_hist3_title": "Espèces observées",
"species_distribution_hist3_tooltip": "Ce graphique montre le pourcentage de cases où chaque espèce a été observée sur le site sélectionné.",
"species_distribution_hist3_tooltip": "Ce graphique montre le pourcentage de carrés de la grille où chaque espèce a été observée sur le site sélectionné.",
"thallus_pie_chart_title": "Type de thalle",
"thallus_pie_chart_tooltip": "Ce graphique illustre le nombre de lichens fruticuleux, foliacés et crustacés observés sur le site sélectionné.",
"thallus_pie_chart_tooltip": "Ce graphique montre les proportions (en termes de nombre de carrés) des lichens foliacés, crustacés et fruticuleux observées sur le site sélectionné.",
"toxitolerance_gauge_title": "Espèces toxitolérantes (%)",
"toxitolerance_gauge_tooltip": "Cet indicateur présente la proportion des espèces toxitolérantes sur le site. Les espèces toxitolérantes sont tolérantes à la pollution de l'air en général. Elles se trouvent principalement dans les environnements urbains fortement perturbés. En général, plus leur proportion sur un site est élevée, plus ce site est affecté par les activités humaines.",
"eutrophication_gauge_title": "Espèces eutrophes (%)",
Expand Down Expand Up @@ -63,7 +64,7 @@
"observation_date": "date de l'observation",
"selected_species_present": "espèce sélectionnée présente",
"percentage": "pourcentage",
"percentage_quadrats": "% de quadrats",
"percentage_quadrats": "% de carrés",
"nb_observations": "nombre de sites",
"très commun": "très commun",
"rare": "rare",
Expand Down
18 changes: 10 additions & 8 deletions dashboard/charts.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ def create_map_observations(filtered_df, map_column_selected, zoom, center, map_
)

fig_map.update_traces(
opacity=0.7,
opacity=0.8,
# cluster=dict(enabled=True, maxzoom=8, size=[3, 10, 20, 30], step=[2, 8, 15, 20], opacity=0.7),
hovertemplate= f"<b>{get_translation('observation_date', lang=lang).capitalize()}</b>: %{{hovertext}}<br>"
f"<b>{get_translation('latitude', lang=lang).capitalize()}</b>: %{{lat}}<br>"
Expand All @@ -64,9 +64,9 @@ def create_map_observations(filtered_df, map_column_selected, zoom, center, map_
lon=[observation_clicked['localisation_long']],
mode='markers',
marker=go.scattermap.Marker(
size=13,
size=14,
color=observation_clicked_color,
opacity=0.5,
opacity=0.7,
),
hoverinfo='skip', # Hide the hover info, to use the one from the main trace
showlegend=False,
Expand All @@ -91,6 +91,7 @@ def create_map_observations(filtered_df, map_column_selected, zoom, center, map_

def create_map_species_present(filtered_df, map_column_selected, zoom, center, map_style, lang):

# Translate the species present column (yes/no) to the selected language and capitalize the first letter
filtered_df['selected_species_present_translated'] = filtered_df['selected_species_present'].apply(lambda x: get_translation(str(x), lang=lang).capitalize())

fig_map = px.scatter_map(
Expand Down Expand Up @@ -256,13 +257,14 @@ def create_hist3(lichen_frequency_df, lang):

def create_pie_thallus(grouped_table_by_observation_and_thallus_df, lang):

# Capitalize the thallus names
capital_grouped_table_by_observation_and_thallus_df = grouped_table_by_observation_and_thallus_df.copy()
capital_grouped_table_by_observation_and_thallus_df['thallus'] = grouped_table_by_observation_and_thallus_df['thallus'].str.capitalize()
# Translate and capitalize the thallus names
grouped_table_by_observation_and_thallus_df = grouped_table_by_observation_and_thallus_df.copy()
grouped_table_by_observation_and_thallus_df['thallus_translated'] = grouped_table_by_observation_and_thallus_df['thallus'].apply(lambda x: get_translation(str(x), lang=lang).capitalize())


pie_thallus = px.pie(
capital_grouped_table_by_observation_and_thallus_df,
names='thallus',
grouped_table_by_observation_and_thallus_df,
names='thallus_translated',
values='nb_lichen_id',
color_discrete_sequence=BASE_COLOR_PALETTE[::3],
)
Expand Down
Loading

0 comments on commit a50aca6

Please sign in to comment.