Apache Superset est un outil de visualisation de données open source depuis 2016. Cet outil a progressivement mûri et, ces dernières années, il s’est imposé comme un leader parmi les outils de visualisation de données open source. Activement développé, il bénéficie d’une communauté très réactive. Synaltic, toujours en veille active sur les projets open source, a su percevoir les signaux indiquant que Superset serait un acteur majeur de la scène de la datavisualisation open source dans les années à venir. Synaltic s’est donc intéressé à cet outil et a réalisé avec succès plusieurs projets de business intelligence en utilisant la combinaison Dremio (data lakehouse) + Apache Superset.
Apache Superset propose des visualisations de grande qualité, une vaste capacité de connexion à diverses sources de données, son propre éditeur de requêtes SQL, ainsi que des fonctionnalités de personnalisation avancées. L’ensemble de ces caractéristiques en fait un outil extrêmement polyvalent, capable de concurrencer les solutions propriétaires.
La personnalisation de Superset est une demande fréquente, et nous allons à présent vous en dévoiler les arcanes.
Que peut-on changer dans l’UI de Superset ?
Dans cet article, nous allons explorer la personnalisation de l’interface de Superset pour l’adapter à votre identité visuelle. Tous les changements présentés se feront via le fichier superset_config.py, qui constitue le fichier de configuration principal permettant de surcharger les paramètres par défaut de l’application.
Nous allons ensemble aborder :
- Comment changer le logo ?
- Comment ajouter un titre dans l’entête des pages ?
- Comment hanger le titre et le favicon dans le navigateur ?
- Comment changer le thème de Superset ?
- Comment modifier la langue dans Superset ?
Superset s’appuie sur un fichier de configuration global, config.py, qui définit l’ensemble des paramètres de l’application. Cependant, pour éviter de modifier directement ce fichier et risquer des conflits lors des mises à jour, Superset permet d’utiliser superset_config.py comme fichier de surcharge.
Toutes les valeurs définies dans superset_config.py prennent la priorité sur celles de config.py, permettant ainsi une personnalisation sans altérer le cœur de l’application.
Pour que Superset prenne en compte vos modifications, il est essentiel de s’assurer que le fichier superset_config.py est correctement reconnu par l’application. Par défaut, Superset ne charge pas automatiquement ce fichier s’il est placé à un emplacement quelconque du système.
Il faut donc l’ajouter explicitement à votre PYTHONPATH ou définir son emplacement via la variable d’environnement SUPERSET_CONFIG_PATH.
Si vous déployez Superset directement sur un système Linux et que votre fichier superset_config.py se trouve sous /app, vous pouvez exécuter la commande suivante :
SUPERSET_CONFIG_PATH=/app/superset_config.py
Dans le cas d’une image Docker personnalisée basée sur l’image officielle de Superset, vous pouvez ajouter votre fichier de configuration avec ces instructions :
COPY --chown=superset superset_config.py /app/
ENV SUPERSET_CONFIG_PATH /app/superset_config.pySi vous utilisez Docker Compose, la gestion de la configuration suit des conventions spécifiques. Il est recommandé de consulter la documentation dédiée pour plus de détails.
Dans le cadre de ses projets, Synaltic déploie Apache Superset au sein de Kubernetes. Ce dernier apporte, par exemple, une simplification de la tolérance à la panne.
Dans cet article, nous utilisons la version de développement de Superset, basée sur la branche master du dépôt GitHub officiel : https://github.com/apache/superset
Dans ce cas, le fichier se trouve à l’emplacement suivant :
superset/docker/pythonpath_dev/superset_config.pyUne fois votre superset_config.py en place :
1- Comment changer le logo ?
Une fois votre instance d’Apache Superset déployée avec Docker, vous pouvez accéder au conteneur superset_app,
puis naviguer vers le dossier :
/app/superset/static/assets/images et y déposer votre logo.
Une fois le logo déposé dans ce dossier, modifiez le fichier de configuration superset_config.py en ajoutant la ligne suivante ( changeant la variable APP_ICON ) :
APP_ICON = "/static/assets/images/logo.png"Où logo.png correspond au nom du fichier que vous avez placé dans le dossier précédent. Ensuite, relancez le conteneur.
[Application Par défaut]
[Application avec logo synaltic]
Vous pouvez également modifier la destination du clic sur le logo. Par défaut, cela ramène à la page d’accueil (vous pouvez par exemple faire en sorte que le logo renvoie vers une documentation, une page d’accueil personnalisée ou un tableau de bord spécifique) via la variable LOGO_TARGET_PATH :
# '/' dirigera l'utilisateur vers la page d'accueil
LOGO_TARGET_PATH = "/superset/dashboard/VGS_TDB/"L’info-bulle du logo peut aussi être personnalisée avec la variable LOGO_TOOLTIP :
# Texte affiché lorsque l'utilisateur survole le logo
LOGO_TOOLTIP = "Ceci est l'infobulle du logo"
[Application avec logo synaltic, infobulle du logo et logo qui dirige vers les tableaux de bord]
2- Comment ajouter un titre dans l’entête ?
En passant à nouveau par le fichier de configuration, vous pouvez ajouter du texte à droite du logo en modifiant la variable LOGO_RIGHT_TEXT :
# Spécifiez le texte qui doit apparaître à droite du logo
LOGO_RIGHT_TEXT = "SYNALTIC BI"
3- Comment changer le titre et le favicon dans le navigateur :
Titre de l’onglet :
Superset est une application web, il est donc possible de modifier le titre affiché dans l’onglet de votre navigateur en ajoutant la ligne suivante dans le fichier config:
# Nom de l'application affiché dans l'onglet du navigateur
APP_NAME = "Synaltic Superset"Favicon:
Le logo affiché dans le coin de l’onglet du navigateur, appelé « favicon », peut lui aussi être modifié. Pour cela, il faudra veiller à déposer le logo dans le dossier /app/superset/static/assets/images, comme précédemment,
puis indiquer le bon chemin dans la variable de configuration FAVICONS :
# Définition du favicon de l'application
FAVICONS = [{"href": "/static/assets/images/favicon.ico"}]
4- Comment changer le thème de Superset?
Vous pouvez personnaliser le thème de l’interface de Superset en surchargeant la variable de configuration THEME_OVERRIDES. Cela vous permet de modifier des éléments tels que les couleurs, la typographie et les polices utilisées dans l’application.
Voici un exemple de personnalisation du thème :
# Theme SYNALTIC
THEME_OVERRIDES = {
# Rayon des bordures des éléments de l'interface
"borderRadius": 10,
# Personnalisation de la palette de couleurs
"colors": {
"text": {
"label": "#ff8000", # Couleur du texte des labels (gris moyen)
"help": "#e67300", # Couleur du texte d'aide (gris foncé)
},
"primary": {
"base": "#ff8000", # Couleur principale (orange)
"dark1": "#e67300", # Couleur principale foncée (orange foncé)
"light1": "#ffbf80", # Couleur principale claire (orange clair)
},
"secondary": {
"base": "#008000", # Couleur secondaire (vert)
},
"grayscale": {
"base": "#879399", # Couleur grise de base (gris moyen)
"light1": "#a9b3b8", # Gris clair
},
"error": {
"base": "#ff0000", # Couleur d'erreur (rouge)
},
},
# Personnalisation de la typographie
"typography": {
"families": {
"sansSerif": "Courier, Monaco, monospace", # Police monospaced personnalisée
"serif": "Georgia, Times, serif", # Police serif
},
"weights": {
"normal": 400, # Poids normal de la police
"bold": 600, # Poids gras de la police
},
},
}
Résultat :
[Thème par défaut]
[Thème personnalisé]
5- Comment modifier la langue dans Superset ?
Superset par défaut est en anglais , pour ajouter une langue il suffit de surcharger la variable LANGUAGES toujours dans superset_config.py
# Définir les langues disponibles pour l'application
LANGUAGES = {
"en": {"flag": "us", "name": "English"}, # Anglais
"fr": {"flag": "fr", "name": "Français"}, # Français
}
Cela ajoutera l’option de changer la langue (par défaut toujours en anglais ) :
Ainsi pour définir changer la langue par défaut, on utilise la variable BABEL_DEFAULT_LOCALE :
# Définir la langue par défaut de l'application
BABEL_DEFAULT_LOCALE = "fr"Conclusion
Cet article vous a permis d’apprendre à personnaliser l’interface d’Apache Superset selon vos besoins. Dans un prochain article, nous aborderons des personnalisations plus avancées pour vos tableaux de bord.
Nous mettons à votre disposition le fichier superset_config.py, regroupant l’ensemble des modifications réalisées dans cet article .
En cas de questions sur cette solution, n’hésitez pas à nous contacter ; nous serons ravis de partager avec vous notre expérience de l’utilisation d’Apache Superset.
Enfin, nous vous invitons fortement à rejoindre la communauté Superset sur Slack et discutez, partagez, apprenez avec des passionnés de la data et de la visualisation :
