Los botones solo son compatibles con los paneles de LookML que tienen la siguiente configuración:
preferred_viewerestablecido endashboards-nextlayoutestablecido ennewspaper
En esta página, se muestra cómo agregar y personalizar un elemento de panel de LookML de type: button con parámetros de panel de LookML en un archivo dashboard.lkml. Los botones son útiles para colocar vínculos en tus paneles. Puedes vincular a contenido de Looker, como vistas y paneles, o a otros sitios web.
Para obtener información sobre cómo agregar botones a un panel a través de la IU de Looker, consulta la página de documentación Crea paneles definidos por el usuario.
Ejemplo de uso
## 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"
}'
Definiciones de los parámetros
| Nombre del parámetro | Descripción | |
|---|---|---|
| Parámetros básicos | ||
type (para elementos) |
Determina el tipo de visualización que se usará en el elemento. | |
name (para elementos) |
Crea un elemento | |
height (para elementos) |
Define la altura del cuadro de mosaico de un elemento de botón. La altura se expresa en unidades de filas para los paneles de layout: newspaper |
|
width (para elementos) |
Define el ancho del cuadro de mosaico de un elemento de botón. El ancho se expresa en unidades de columnas para los paneles de layout: newspaper |
|
row |
Define la posición de arriba hacia abajo del cuadro de tarjeta de un elemento de botón en unidades de filas para los paneles de layout: newspaper. |
|
col |
Define la posición de izquierda a derecha del cuadro de mosaico de un elemento de botón en unidades de columnas para los paneles de layout: newspaper |
|
| Parámetro de botón | ||
rich_content_json |
Un objeto JSON que contiene pares clave-valor con información sobre el botón | |
Parámetros básicos
Cuando definas un elemento de panel de LookML de type: button, debes especificar valores para, al menos, los parámetros name y type.
Los parámetros height, width, row y col se aplican al cuadro de tarjeta de un elemento de botón, no al botón en sí.
name
En esta sección, se hace referencia al parámetro
nameque forma parte de un elemento de panel.
nametambién se puede usar como parte de un filtro de panel, que se describe en la página de documentación Parámetros del panel.
Cada declaración name crea un nuevo elemento de panel y le asigna un nombre. Los nombres de los elementos deben ser únicos.
El name que se le asigne al botón no aparecerá en la IU del panel.
- name: orders_by_date
type
En esta sección, se hace referencia al parámetro
typeque forma parte de un elemento de panel.
typetambién se puede usar como parte de un filtro de panel, que se describe en la página de documentación Parámetros del panel.
typetambién se puede usar como parte de una unión, que se describe en la página de documentación del parámetrotype(para uniones).
typetambién se puede usar como parte de una dimensión, que se describe en la página de documentación Tipos de dimensiones, filtros y parámetros.
typetambién se puede usar como parte de una medición, que se describe en la página de documentación Tipos de mediciones.
El parámetro type determina el tipo de visualización que se usará en el elemento.
- 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 | group
Consulta la página de documentación de type (para paneles de LookML) para obtener una descripción general de los diferentes tipos de elementos de panel de LookML.
height
En esta sección, se hace referencia al parámetro
heightque forma parte de un elemento de panel.
heighttambién se puede usar como parte de una fila del panel, que se describe en la página de documentación Parámetros del panel.
El parámetro height define la altura del cuadro de mosaico de un elemento de botón, en unidades de fila.
Las cajas de tarjetas de elementos de botón tienen una altura predeterminada de 6 filas. La altura mínima es de 1 fila. Cambiar la altura del elemento de botón puede afectar a otros elementos del panel, pero no afectará la altura del botón en sí.
Por ejemplo, el siguiente código establece que el cuadro de mosaico del botón tenga 12 filas de alto:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
height: 12
...
width
En esta sección, se hace referencia al parámetro
widthque forma parte de un elemento de panel.
widthtambién se puede usar como parte de un panel, que se describe en la página de documentación Parámetros del panel.
El parámetro width define el ancho del cuadro de mosaico de un elemento de botón, en unidades de columnas.
El ancho del cuadro de mosaico de un elemento de botón se establece de forma predeterminada en 8 columnas, lo que equivale a un tercio del ancho total de un panel. El ancho mínimo de la caja de mosaico de un botón es de 2.
Por ejemplo, el siguiente código establece el cuadro de mosaico de un botón en la mitad del ancho del panel:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
width: 12
...
Si hay espacio dentro del cuadro de mosaico de un botón, el ancho del botón aumentará para dar cabida a una cadena de texto larga, que se define en text. Sin embargo, el ancho del botón no aumentará más allá del valor establecido en el parámetro width y, si es necesario, la cadena definida en text se truncará en el botón.
row
El parámetro row define la fila en la que se coloca el borde superior del cuadro de mosaico de un elemento de botón.
Si el botón se coloca dentro de un grupo de tarjetas con el parámetro group, row define la posición de la fila del botón en relación con la parte superior del contenedor del grupo (row: 0).
Un panel comienza con la fila 0 en la parte superior. Los elementos de botón del panel tienen una altura predeterminada de 6 filas, lo que significa que los elementos del panel que se encuentran en la parte superior (row: 0) ocuparían de forma predeterminada las filas de la 0 a la 5.
En el siguiente ejemplo, el código establece que el cuadro de mosaico de un botón se coloque en la segunda fila de elementos del panel, suponiendo que los elementos se establecen en la altura predeterminada:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
row: 6
...
col
El parámetro col define la columna en la que se coloca el borde izquierdo del cuadro de mosaico del elemento de botón. Si el botón se coloca dentro de un grupo de tarjetas con el parámetro group, col define la posición de la columna del botón en relación con el borde izquierdo del contenedor del grupo (col: 0).
Los paneles se dividen en 24 columnas. Un panel comienza con la columna 0 a la izquierda del panel. Un panel con diseño de periódico tiene un ancho de elemento predeterminado de 8 columnas, lo que significa que los elementos del panel que se encuentran a la izquierda (col: 0) ocuparían las columnas de la 0 a la 7 de forma predeterminada.
Por ejemplo, el siguiente código establece que un elemento se coloque en la tercera columna de elementos del panel:
- dashboard: sales_overview
layout: newspaper
...
elements:
- name: orders_by_date
col: 16
...
Parámetro del botón
El parámetro que se describe en esta sección se puede usar para agregar contenido a un elemento de panel de LookML de type: button.
rich_content_json
rich_content_json es un objeto JSON con varios pares clave-valor que definen las características del botón del panel.
En el siguiente ejemplo de uso, se muestra un botón de panel que navega a otro panel.
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"
}'
En el siguiente ejemplo de uso, se muestra un botón del panel que navega a una pestaña del panel.
rich_content_json: '{
"text": "Go to Users tab",
"description": "View user data from the last 18 months.",
"newTab": false,
"alignment": "center",
"size": "medium",
"style": "FILLED",
"color": "forestgreen",
"targetTabName":"Users"
"href":""
}'
text
text define el texto que aparecerá en el botón de la IU del panel. El ancho del botón se expande para adaptarse al texto hasta que alcanza el límite establecido por el parámetro width, momento en el que se truncará el texto.
description
description define el texto que aparece como información sobre la herramienta cuando mantienes el cursor sobre el botón. Si no se proporciona una descripción, se muestra de forma predeterminada el vínculo proporcionado en href.
newTab
newTab es un valor booleano que define si el vínculo del botón se abrirá en una pestaña nueva (true) o en la pestaña actual (false). El valor predeterminado de newTab es true.
alignment
alignment establece la alineación del botón dentro del cuadro de tarjeta del elemento de botón. La configuración predeterminada de alignment es center.
tamaño
size establece el tamaño del botón y su texto en small, medium o large. El valor de size no afecta el tamaño del cuadro de mosaico del elemento de botón ni el parámetro height.
style
style establece el estilo del botón en uno de los siguientes valores:
FILLED: El cuerpo del botón se completa con el color establecido encolor. El texto del botón es blanco. Este es el valor predeterminado.OUTLINED: El botón tiene un contorno alrededor de su borde, pero su cuerpo es transparente. El color del texto del botón se establece concolor.TRANSPARENT: El cuerpo del botón es transparente. El color del texto del botón se establece concolor.
color
color establece el color del botón o del texto del botón, según el parámetro de configuración de style. color se establece de forma predeterminada en el primer color de la colección de colores categóricos predeterminada de la instancia de Looker.
Los valores de color se pueden formatear como cadenas hexadecimales, como #2ca6cd, o como nombres de colores CSS, como mediumblue.
targetTabName
Si tu panel tiene pestañas, targetTabName establece la pestaña del panel a la que el botón llevará a los usuarios.
Obtén más información sobre los paneles con pestañas.
href
href establece la URL a la que el botón llevará a los usuarios. Los vínculos a otros paneles de Looker pueden contener parámetros de filtro que establecen filtros de panel en valores específicos.