Livre de recettes pour tirer le meilleur parti des visualisations Looker: personnalisation des info-bulles

L'info-bulle de la visualisation affiche par défaut la valeur des dimensions et mesures sélectionnées. Elle peut aider les utilisateurs à comprendre l'importance d'un seul point de données.

Par exemple, une info-bulle pour une visualisation cartographique basée sur la marge brute totale regroupée par État affiche les valeurs des deux champs lorsqu'un utilisateur pointe sur la Californie.

Un utilisateur pointe sur la Californie pour afficher une info-bulle avec la valeur "Californie" pour l'État et "988 018,58 $" pour la marge bénéficiaire brute totale.

Toutefois, que faire si vous souhaitez inclure des champs autres que les champs par défaut dans l'info-bulle afin que les utilisateurs puissent obtenir plus d'informations ou de contexte sur un point de données sans avoir à chercher ailleurs ?

Vous pouvez personnaliser l'info-bulle pour afficher les valeurs de plusieurs champs spécifiés, y compris des champs qui ne figurent pas dans la requête d'exploration.

Composants

Prérequis

Pour personnaliser l'info-bulle, vous devez disposer des éléments suivants:

Considérations concernant la personnalisation des info-bulles

Lorsque vous personnalisez une info-bulle, tenez compte des points suivants:

  • Les valeurs du paramètre html deviennent l'axe Y d'une visualisation.
  • La valeur que vous souhaitez afficher sur l'axe des ordonnées doit correspondre à celle du paramètre sql de la mesure.
  • Lorsque vous utilisez une mesure formatée (une mesure de type: percent_of_total ou une mesure avec un paramètre value_format_name ou value_format), veillez à utiliser la syntaxe Liquid pour la valeur affichée {{ field_name._rendered_value }} (où field_name est le nom réel de la mesure ou de la dimension).

Exemple

Par défaut, l'info-bulle des points de données de la visualisation inclut les valeurs de Marge brute totale et État. Toutefois, que faire si vous souhaitez fournir aux utilisateurs des informations supplémentaires qui ne figurent pas sur la carte ni dans la requête Explorer ? Que faire si vous souhaitez inclure la valeur d'un champ appelé Pourcentage de la marge brute totale au lieu de État ? L'inclusion de la Pourcentage de la marge brute totale permet aux utilisateurs de comprendre comment la valeur de la marge brute totale d'un point de données individuel se compare à la marge brute totale de l'ensemble de données.

Pour personnaliser l'info-bulle, procédez comme suit:

measure: total_gross_margin {
  type: sum
  value_format_name: decimal_2
  sql: ${gross_margin} ;;
  html: {{ rendered_value }} | {{percent_of_gross_margin._rendered_value }} of total ;;
}

  1. En mode développement, accédez à la définition LookML du champ que vous souhaitez personnaliser.

    Vous pouvez accéder directement à la définition LookML d'un champ à partir d'une exploration.

  2. Déterminez les champs et les valeurs que vous souhaitez inclure dans l'info-bulle en plus du champ d'origine. Par exemple, Pourcentage de la marge brute totale.

  3. Ajoutez un paramètre html à la mesure d'origine référencée dans la requête d'exploration et affichée dans l'info-bulle. Dans ce cas, la mesure actuellement présente dans la requête d'exploration et affichée dans l'info-bulle est Marge brute totale.

  4. Dans le paramètre html, créez une expression avec des variables Liquid qui ajoute les champs supplémentaires à la valeur de la mesure existante.

    • Cet exemple utilise la variable Liquid _rendered_value pour afficher des valeurs formatées Looker. Par exemple, total_gross_margin utilise la mise en forme Looker pour deux décimales, et percent_of_total_gross_margin utilise la mise en forme Looker pour les pourcentages avec deux décimales.
    • Vous pouvez utiliser un caractère barre verticale,|, pour séparer les valeurs de différents champs.
    • Vous pouvez également ajouter d'autres mots qui pourraient clarifier la signification des autres valeurs affichées dans l'info-bulle. Dans ce cas, of total est ajouté pour clarifier la signification de la valeur de pourcentage.

  5. Enregistrez, validez et déployez votre code en production une fois que vous vous êtes assuré qu'il fonctionne comme prévu.

L'info-bulle affiche désormais deux valeurs lorsqu'un utilisateur pointe sur un point de données: la valeur total_gross_margin du point de données et la valeur percent_of_total_gross_margin correspondante.

Étapes suivantes

Une fois que vous avez créé votre visualisation avec une info-bulle personnalisée, vous pouvez la partager avec d'autres utilisateurs: