La visualisation des données est une boîte à outils importante pour un data scientist. Construire de beaux tableaux de bord est une compétence importante à acquérir si vous envisagez de montrer vos idées à un cadre de niveau C.
Dans cet article de blog, vous obtiendrez une introduction à un framework de visualisation en Python. Vous apprendrez à créer un tableau de bord, de la récupération des données à la création de widgets interactifs à l'aide de Dash, un framework de visualisation en Python.
📖 Apprentissage complémentaire :Pour un guide complet sur la façon de créer votre belle application de tableau de bord en Python pur, consultez notre livre à succès Python Dash avec l'éditeur NoStarch basé à San Francisco.
Présentation de Dash
Le cadre de tableau de bord peut être divisé en deux composants
- Mises en page :La mise en page est l'élément d'interface utilisateur de votre tableau de bord. Vous pouvez utiliser des composants tels que Button, Table, Radio Buttons et les définir dans votre mise en page.
- Rappels :Les rappels fournissent la fonctionnalité pour ajouter de la réactivité à votre tableau de bord. Cela fonctionne en utilisant une fonction de décorateur pour définir les entités d'entrée et de sortie.
Dans la section suivante, vous apprendrez à créer un tableau de bord simple pour visualiser les performances du marathon de 1991 à 2018.
Importer les bibliothèques
Importons d'abord toutes les bibliothèques d'importation
import dash import dash_core_components as dcc import dash_html_components as html import dash_split_pane import plotly.express as px import pandas as pd from datetime import datetime
Nous importons le pandas
bibliothèque pour charger les données et la bibliothèque de tableau de bord pour construire le tableau de bord.
Le plotly express
est construite sur Plotly pour fournir des fonctionnalités faciles à utiliser pour la visualisation des données.
Tout d'abord, nous commencerons par télécharger les données. Les données sont accessibles sur Kaggle via le lien suivant.
Étape 1 :Initialiser une application Dash
Nous commençons par initialiser une application dash et en utilisant la commande run_server
pour démarrer le serveur.
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css'] app = dash.Dash(__name__, external_stylesheets=external_stylesheets) if __name__ == '__main__': app.run_server(debug=True)
Étape 2 :Création de la mise en page
Nous commencerons par diviser notre couche d'interface utilisateur en deux parties - le volet de gauche affichera la fenêtre des paramètres qui comprendra une option pour sélectionner l'année. Le volet de droite comprendra une fenêtre graphique affichant un diagramme à barres.
app.layout = html.Div(children=[ html.H1(children='World Marathon Analysis', style={'textAlign': 'center'}), dash_split_pane.DashSplitPane( children=[ html.Div(children=[ html.H1(children='Settings', style={'textAlign': 'center'}), ], style={'margin-left': '50%', 'verticalAlign': 'middle'}), html.Div(children=[ html.H1(children='Graph View', style={'textAlign': 'center'}), ]) ], id="splitter", split="vertical", size=1000, ) ])
On construit deux div
éléments - un pour le volet de gauche et l'autre pour le volet de droite. Pour aligner les éléments d'en-tête au centre, nous utilisons le style
balise et en utilisant la syntaxe CSS standard pour positionner les éléments HTML.
Si vous démarrez maintenant le serveur et accédez à votre navigateur sur localhost:8050
, vous verrez la fenêtre suivante.
Étape 3 :Création du widget déroulant et de la fenêtre graphique
Une fois que nous avons la configuration de base de la mise en page, nous pouvons continuer avec les parties restantes.
Charger les données
Nous commençons par charger les données à l'aide de la bibliothèque pandas
def convert_to_time(time_in_some_format): time_obj = datetime.strptime(time_in_some_format, '%H:%M:%S').time() return time_obj def get_data(): df = pd.read_csv('world_marathon_majors.csv', engine="python") df['time'] = df['time'].apply(convert_to_time) return df
Nous créons deux fonctions pour charger les données et convertir la valeur de temps en datetime
valeurs d'objet.
Le tableau ci-dessous montre les cinq premières lignes de l'ensemble de données.
Chaque ligne se compose de
- L'année le marathon a eu lieu
- Le gagnant du marathon cette année-là
- Le genre du gagnant
- Le pays le gagnant représente
- Le temps pour finir la course
- Le pays dans lequel le marathon a eu lieu.
Étendre la mise en page
L'étape suivante consiste à étendre notre couche de mise en page en ajoutant le widget déroulant et la fenêtre graphique.
app.layout = html.Div(children=[ html.H1(children='World Marathon Analysis', style={'textAlign': 'center'}), dash_split_pane.DashSplitPane( children=[ html.Div(children=[ html.H1(children='Settings', style={'textAlign': 'center'}), dcc.Dropdown(id='dropdown-menu', options=[{'label':x, 'value': x} for x in range(df['year'].min(), df['year'].max()+1)], value=df['year'].max(), style={'width': '220px','font-size': '90%','height': '40px',} ) ], style={'margin-left': '50%', 'verticalAlign': 'middle'}), html.Div(children=[ html.H1(children='Graph View', style={'textAlign': 'center'}), dcc.Graph( id='input-graph',figure=get_default_data()) ]) ], id="splitter", split="vertical", size=1000, ) ])
Nous donnons au widget déroulant un identifiant unique appelé dropdown-menu et la fenêtre graphique reçoit un id input-graph.
Rappels
Les rappels sont utilisés pour permettre la communication entre deux widgets.
Nous définissons une fonction appelée update_output_div
qui prend la valeur de l'année chaque fois que le menu déroulant est modifié.
A chaque modification de la valeur de la liste déroulante, la fonction update_output_div
est exécuté et un diagramme à barres est dessiné pour indiquer les meilleurs pays qui ont remporté la course.
@app.callback( dash.dependencies.Output('input-graph', 'figure'), [dash.dependencies.Input('dropdown-menu', 'value')] ) def update_output_div(value): test_sample = df[df['year'] == value] test_sample = test_sample.groupby('country')['time'].min().reset_index() tt = test_sample.sort_values(by=['time']) fig = px.bar(tt, y='country', x='time', orientation='h', hover_data=["time"], ) return fig
Démo en direct
Voyons maintenant le tableau de bord en action.
Résumé
Dans cet article de blog, vous avez appris à créer un tableau de bord simple en Python. Vous pouvez étendre le tableau de bord ci-dessus pour inclure plus de widgets et afficher plus de graphiques pour une analyse plus approfondie.
Livre de tableau de bord Python
Si vous souhaitez en savoir plus sur la création de superbes applications de tableau de bord en Python, consultez notre nouveau livre Python Dash.
Vous avez déjà vu des tableaux de bord ; pensez à des visualisations des résultats des élections que vous pouvez mettre à jour en temps réel ou à des cartes de la population que vous pouvez filtrer par groupe démographique.
Avec la bibliothèque Python Dash, vous allez créer des tableaux de bord analytiques qui présentent les données de manière efficace, utilisable et élégante en quelques lignes de code seulement.
Obtenez le livre sur NoStarch ou Amazon !