Pour utiliser les paramètres de bouton, votre administrateur Looker doit activer la fonctionnalité expérimentale Boutons personnalisés pour le tableau de bord.
Les boutons ne sont compatibles qu'avec les tableaux de bord LookML avec les paramètres suivants:
preferred_viewer
défini surdashboards-next
layout
défini surnewspaper
Cette page explique comment ajouter et personnaliser un élément de tableau de bord LookML de type: button
avec des paramètres de tableau de bord LookML dans un fichier dashboard.lkml
. Les boutons sont utiles pour placer des liens dans vos tableaux de bord. Vous pouvez créer un lien vers du contenu Looker, comme Look et les tableaux de bord, ou vers d'autres sites Web.
Pour en savoir plus sur l'ajout de boutons à un tableau de bord via l'UI Looker, consultez la page Créer des tableaux de bord définis par l'utilisateur.
Exemple d'utilisation
## BASIC PARAMETERS
type: button
name: text
height: N
width: N
row: N
col: N
## BUTTON PARAMETER
rich_content_json: '{
"text": "button text",
"description": "description",
"newTab": true | false,
"alignment": "left" | "right" | "center",
"size": "small" | "medium" | "large",
"style": "OUTLINED" | "FILLED" | "TRANSPARENT",
"color": "hex string or css color",
"href": "link"
}'
Définitions des paramètres
Nom du paramètre | Description | |
---|---|---|
Paramètres de base | ||
type (pour les éléments) |
Détermine le type de visualisation à utiliser dans l'élément | |
name (pour les éléments) |
Crée un élément | |
height (pour les éléments) |
Définit la hauteur de la case d'un élément de bouton. La hauteur est indiquée en unités de lignes pour les tableaux de bord layout: newspaper . |
|
width (pour les éléments) |
Définit la largeur de la case d'un élément de bouton. La largeur est exprimée en unités de colonnes pour les tableaux de bord layout: newspaper . |
|
row |
Définit la position du haut vers le bas de la tuile d'un élément de bouton en unités de lignes pour les tableaux de bord layout: newspaper . |
|
col |
Définit la position de la boîte à tuiles d'un élément de bouton en unités des colonnes des tableaux de bord layout: newspaper . |
|
Paramètre du bouton | ||
rich_content_json |
Objet JSON contenant des paires clé/valeur avec des informations sur le bouton |
Paramètres de base
Lorsque vous définissez un élément du tableau de bord LookML de type: button
, vous devez spécifier au moins les valeurs des paramètres name
et type
.
Les paramètres height
, width
, row
et col
s'appliquent à la zone carrée d'un élément, et non au bouton lui-même.
name
Cette section fait référence au paramètre
name
qui fait partie d'un élément de tableau de bord.
name
peut également être utilisé dans le cadre d'un filtre de tableau de bord, décrit sur la page de documentation des paramètres du tableau de bord.
Chaque déclaration name
crée un élément de tableau de bord et lui attribue un nom. Les noms d'élément doivent être uniques.
Le name
attribué au bouton n'apparaîtra pas dans l'UI du tableau de bord.
- name: orders_by_date
type
Cette section fait référence au paramètre
type
qui fait partie d'un élément de tableau de bord.
type
peut également être utilisé dans le cadre d'un filtre de tableau de bord, décrit sur la page de documentation des paramètres du tableau de bord.
type
peut également être utilisé dans le cadre d'une jointure, décrite sur la page de documentation du paramètretype
(pour les jointures).
type
peut également être utilisé dans une dimension, décrite sur la page de documentation sur la dimension, le filtre et les types de paramètres.
type
peut également être utilisé dans une mesure, décrite sur la page de documentation Types de mesures.
Le paramètre type
détermine le type de visualisation à utiliser dans l'élément.
- name: element_name
type: text | looker_grid | table | single_value | looker_single_record |
looker_column | looker_bar | looker_scatter | looker_line | looker_area |
looker_pie | looker_donut_multiples | looker_funnel | looker_timeline |
looker_map | looker_geo_coordinates | looker_geo_choropleth | looker_waterfall |
looker_wordcloud | looker_boxplot | button
Consultez la page de documentation type
(pour les tableaux de bord LookML) pour obtenir un aperçu des différents types d'éléments du tableau de bord LookML.
height
Cette section fait référence au paramètre
height
qui fait partie d'un élément de tableau de bord.
height
peut également être utilisé dans le cadre d'une ligne de tableau de bord, comme décrit sur la page de documentation des paramètres du tableau de bord.
Le paramètre height
définit la hauteur de la tuile d'un élément de bouton, en unités de ligne.
Par défaut, la hauteur des zones de l'élément de bouton est de six lignes. La hauteur minimale est de 1 ligne. La modification de la hauteur de l'élément de bouton peut affecter d'autres éléments du tableau de bord, mais pas la hauteur du bouton lui-même.
Par exemple, le code suivant définit une zone de tuile de 12 lignes de haut:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
height: 12
...
width
Cette section fait référence au paramètre
width
qui fait partie d'un élément de tableau de bord.
width
peut également être utilisé dans un tableau de bord, comme décrit sur la page de documentation des paramètres du tableau de bord.
Le paramètre width
définit la largeur de la tuile d'un élément de bouton, en unités de colonnes.
Par défaut, la largeur de la zone d'emplacement d'un élément de bouton est de 8 colonnes, soit un tiers de la largeur totale d'un tableau de bord. La largeur minimale de la zone de tuiles d'un bouton est de 2
.
Par exemple, le code suivant définit la zone de tuile d'un bouton sur la moitié de la largeur du tableau de bord:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
width: 12
...
S'il y a de la place dans la zone de tuile d'un bouton, la largeur du bouton augmentera pour accueillir une longue chaîne de texte, définie dans text
. Cependant, la largeur du bouton n'excède pas la valeur définie dans le paramètre width
. Si nécessaire, la chaîne définie dans text
sera tronquée sur le bouton.
row
Le paramètre row
définit la ligne sur laquelle le bord supérieur de la tuile d'un élément de bouton est placé.
Un tableau de bord commence par la ligne 0 en haut du tableau de bord. Par défaut, la hauteur des éléments du bouton du tableau de bord est de six lignes. Les éléments du tableau de bord en haut du tableau de bord (row: 0
) occupent par défaut les lignes 0 à 5.
Dans l'exemple suivant, le code définit la zone de tuile d'un bouton à placer sur la deuxième ligne d'éléments du tableau de bord, en supposant que les éléments sont définis à la hauteur par défaut:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
row: 6
...
col
Le paramètre col
définit la colonne sur laquelle le bord gauche de la tuile de l'élément bouton est placé.
Les tableaux de bord sont divisés en 24 colonnes. Un tableau de bord commence par la colonne 0 à gauche du tableau de bord. Par défaut, la largeur d'un tableau de bord avec une mise en page de journal est de 8 colonnes, ce qui signifie que les éléments situés à gauche d'un tableau de bord (col: 0
) occupent par défaut les colonnes 0 à 7.
Par exemple, le code suivant définit un élément à définir dans la troisième colonne d'éléments du tableau de bord:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
col: 16
...
Paramètre du bouton
Le paramètre décrit dans cette section peut être utilisé pour ajouter du contenu à un élément du tableau de bord LookML de type: button
.
rich_content_json
rich_content_json
est un objet JSON avec plusieurs paires clé/valeur qui définissent les caractéristiques du bouton du tableau de bord.
rich_content_json: '{
"text": "Go to Sales Dashboard",
"description": "View sales from the last 18 months.",
"newTab": true,
"alignment": "center",
"size": "medium",
"style": "FILLED",
"color": "forestgreen",
"href":"https://instance_name.looker.com/dashboards/152?State=California&Created+Fiscal+Quarter=2022"
}'
text
text
définit le texte qui s'affichera sur le bouton dans l'interface utilisateur du tableau de bord. Le bouton se développe pour s'adapter au texte jusqu'à ce que la limite définie par le paramètre width
soit atteinte. Le texte est alors tronqué.
description
description
définit le texte qui s'affiche sous forme d'info-bulle pop-up lorsque l'utilisateur passe la souris sur le bouton. Si aucune description n'est fournie, le lien fourni dans href
est utilisé par défaut.
newTab
newTab
est une valeur booléenne qui détermine si le lien du bouton s'ouvrira dans un nouvel onglet (true
) ou dans l'onglet actuel (false
). newTab
est défini par défaut sur true
.
alignment
alignment
définit l'alignement du bouton dans la case de cet élément. La valeur par défaut de alignment
est center
.
size
size
définit la taille du bouton et de son texte sur small
, medium
ou large
. La valeur de l'attribut size
n'a pas d'incidence sur la taille de la case de l'élément bouton ni sur le paramètre height
.
style
style
définit le style du bouton sur l'une des valeurs suivantes:
FILLED
: le corps du bouton est rempli par la couleur définie danscolor
. Le texte du bouton est blanc. Il s'agit de la valeur par défaut.OUTLINED
: le bouton est contrôlé par un contour, mais son corps est transparent. La couleur du texte du bouton est définie parcolor
.TRANSPARENT
: le corps du bouton est transparent. La couleur du texte du bouton est définie parcolor
.
color
color
définit la couleur ou le texte du bouton, en fonction du paramètre style
. color
est défini par défaut sur la première couleur dans la collection de couleurs catégorielles par défaut de l'instance Looker.
Les valeurs de couleur peuvent être mises en forme sous forme de chaînes hexadécimales (#2ca6cd
, par exemple) ou de noms de couleurs CSS (mediumblue
).
href
href
définit l'URL vers laquelle le bouton redirige les utilisateurs. Les liens vers d'autres tableaux de bord Looker peuvent contenir des paramètres de filtre qui définissent des filtres de tableau de bord sur des valeurs spécifiques.
Dans une expérience intégrée, les liens vers les tableaux de bord doivent contenir
embed/
dans l'URL du lien.