Después de crear una incorporación, que se puede hacer de forma pública, privada, con incorporación firmada o a través de la API, puedes interactuar con esos elementos iframe usando JavaScript. Puedes hacer que tu página sea más dinámica según el estado del elemento incorporado y, también, realizar cambios en el elemento incorporado desde tu página web.
Ten en cuenta que Looker no controla el orden en que los navegadores envían eventos a las aplicaciones web. Esto significa que el orden de los eventos no está garantizado en todos los navegadores o plataformas. Asegúrate de escribir tu código JavaScript de forma adecuada para tener en cuenta el control de eventos de los diferentes navegadores.
Puedes usar JavaScript de una de las siguientes maneras para el contenido incorporado de Looker:
- Usar el kit de desarrollo de software (SDK) de incorporación de Looker, que se describe en la página de documentación del SDK de incorporación
- Usando eventos de JavaScript, como se describe en la sección Cómo acceder a eventos en JavaScript de esta página
Preparación
Antes de interactuar con el iframe incorporado, sigue estos pasos:
- Agrega un ID al iframe.
- Agrega el dominio de incorporación al atributo
src
del iframe. - Agrega el dominio de incorporación a la lista de entidades permitidas.
Cómo agregar un ID al iframe
Más adelante, cuando recuperes datos del iframe, deberás validar que la información con la que trabajas provenga realmente del iframe de Looker. Para facilitar esto, asegúrate de agregar un ID a tu iframe, si aún no lo hiciste. En el siguiente ejemplo, se establece el ID en looker
agregando id="looker"
al iframe:
<iframe id="looker" src="https://instance_name.looker.com/embed/dashboards/1"></iframe>
Cómo agregar el dominio de incorporación al atributo src
del iframe
En el atributo src
del iframe, incluye el dominio en el que se usa el iframe. En el siguiente ejemplo, puedes especificar myownpersonaldomain.com
como el dominio agregando ?embed_domain=https://myownpersonaldomain.com"
al final de la URL en el atributo src
:
<iframe
id="looker"
src="https://instance_name.looker.com/embed/dashboards/1?embed_domain=https://myownpersonaldomain.com">
</iframe>
Si usas la incorporación firmada, asegúrate de agregar el parámetro embed_domain
a la URL de incorporación.
Si usas el SDK de Embed, agrega sdk=3
al final de la URL de incorporación. El parámetro sdk=3
indica que el SDK está presente y que Looker puede aprovechar las funciones adicionales que proporciona el SDK, como pasar eventos de JavaScript entre el iframe de Looker y tu dominio. El SDK no puede agregar este parámetro por sí solo porque forma parte de la URL firmada. Por ejemplo:
<iframe
id="looker"
src="https://instance_name.looker.com/embed/dashboards/1?embed_domain=https://myownpersonaldomain.com&sdk=2">
</iframe>
Cómo agregar el dominio de incorporación a la lista de entidades permitidas
Por último, deberás agregar el dominio en el que se usa el iframe a la lista de entidades permitidas en la página Incorporar del panel Administrador de Looker. Para ello, sigue estos pasos:
En el campo Lista de entidades permitidas de dominios incorporados, ingresa el dominio en el que se usa el iframe y, luego, presiona la tecla Tab para que el dominio aparezca en un cuadro dentro del campo.
Haz clic en Actualizar.
Puedes usar el comodín *
en la lista de entidades permitidas para crear un patrón de dominio. Por ejemplo, https://*.myownpersonaldomain.com
permitiría https://analytics.myownpersonaldomain.com
y https://data.myownpersonaldomain.com
.
Si usas la incorporación sin cookies con Looker 23.8 o versiones posteriores, el dominio de incorporación se puede especificar cuando se adquiere la sesión sin cookies. Esta es una alternativa para agregar el dominio de incorporación a la lista de entidades permitidas con el panel Admin > Embed. Si decides aprovechar esta función, revisa las prácticas recomendadas de seguridad.
Cómo recuperar datos del iframe
Después de completar los pasos de preparación, puedes acceder a los eventos que se pasan entre el iframe de Looker y tu dominio escuchando los eventos postMessage
.
El iframe incorporado puede crear algunos tipos de eventos, como se describe en la sección Referencia de tipos de eventos de esta página.
Cómo acceder a eventos en JavaScript
A continuación, se muestra un ejemplo de cómo escuchar estos eventos en JavaScript y, luego, registrarlos en la consola:
window.addEventListener("message", function(event) {
if (event.source === document.getElementById("looker").contentWindow) {
if (event.origin === "https://instance_name.looker.com") {
console.log(JSON.parse(event.data));
}
}
});
A continuación, se muestra un ejemplo de cómo escuchar estos eventos en jQuery y, luego, registrarlos en la consola:
$(window).on("message", function(event) {
if (event.originalEvent.source === $("#looker")[0].contentWindow) {
if (event.origin === "https://instance_name.looker.com") {
console.log(JSON.parse(event.data));
}
}
});
Tabla de resumen del tipo de evento
En la siguiente tabla, se resumen los tipos de eventos. Selecciona un tipo de evento para ver sus detalles.
Tipo de evento | Causa del evento |
---|---|
dashboard:loaded |
En los paneles en los que las tarjetas no están configuradas para ejecutarse automáticamente, se cargaron el panel y sus elementos, pero las consultas aún no se están ejecutando. |
dashboard:run:start |
Se comenzó a cargar un panel, y sus tarjetas comenzaron a cargar y consultar datos. |
dashboard:run:complete |
Se completó la ejecución de un panel y se terminaron de cargar y consultar todas las tarjetas. |
dashboard:download |
Se inició la descarga de un PDF de un panel. |
dashboard:edit:start |
Se agregó la versión 22.20
Se cambió un panel al modo de edición. El evento dashboard:save:complete se activará cuando el panel se guarde correctamente. |
dashboard:edit:cancel |
Se agregó en la versión 22.20 Se salió de un panel en modo de edición sin guardar. |
dashboard:save:complete |
Se editó y guardó un panel. |
dashboard:delete:complete |
Se borró un panel. |
dashboard:tile:start |
Se inició la carga o la consulta de datos de una tarjeta. |
dashboard:tile:complete |
Una tarjeta terminó de ejecutar la consulta. |
dashboard:tile:download |
Comenzó la descarga de los datos de una tarjeta. |
dashboard:tile:explore |
Un usuario hizo clic en la opción Explorar desde aquí en una tarjeta del panel. |
dashboard:tile:view |
Un usuario hizo clic en la opción Ver aspecto original en una tarjeta del panel. |
dashboard:filters:changed |
Se aplicaron o cambiaron los filtros de un panel. |
look:ready |
Un Look comenzó a cargar datos de la consulta, independientemente de si se ejecutará la consulta o no. |
look:run:start |
Un Look comenzó a cargar datos de la consulta y la consulta comenzó a ejecutarse. |
look:run:complete |
Una mirada terminó de ejecutar la consulta. |
look:edit:start |
Se agregó la versión 25.10
Se cambió un Look al modo de edición. El evento look:save:complete se activará cuando se guarde el atuendo. |
look:edit:cancel |
Se agregó en la versión 25.10 Se salió del modo de edición de una mirada sin guardar. |
look:save:complete |
Se editó y guardó una vista. |
look:delete:complete |
Se movió una vista al carpeta de la papelera. |
drillmenu:click |
Un usuario hizo clic en un menú de desglose en un panel creado con el parámetro de LookML link . |
drillmodal:download |
Un usuario abrió un diálogo de desglose desde una tarjeta del panel y hizo clic en la opción Descargar. |
drillmodal:explore |
Un usuario hizo clic en la opción Explorar desde aquí en un diálogo de desglose. |
explore:ready |
Una exploración comenzó a cargar datos de la consulta, independientemente de si se ejecutará o no. |
explore:run:start |
Una exploración comenzó a cargar datos de la consulta y la consulta comenzó a ejecutarse. |
explore:run:complete |
Se completó la ejecución de una consulta de Explorar. |
explore:state:changed |
Cambió la URL de una página de Explorar como resultado de las acciones del usuario. |
page:changed |
Un usuario navegó a una página nueva dentro del iframe. |
page:properties:changed |
Cambió la altura de un iframe del panel. |
session:tokens |
El cliente de Looker requiere tokens para continuar. |
session:expired |
Se agregó el 25/10 La sesión del usuario caducó. |
session:status |
Envía información sobre el estado de una sesión. |
env:client:dialog |
Se abrió un diálogo que puede estar parcialmente fuera de la vista, como un diálogo de desglose. Este evento permite que la aplicación de hosting desplace el diálogo hasta que quede a la vista. |
Referencia del tipo de evento
El iframe incorporado puede crear muchos tipos diferentes de eventos:
dashboard:loaded
En los paneles en los que los mosaicos no están configurados para ejecutarse automáticamente, este evento se crea después de que se cargan un panel y sus elementos, pero antes de que se ejecuten las consultas.
type: "dashboard:loaded",
status: "complete",
dashboard: {
id: 1,
title: "Business Pulse",
canEdit: true,
dashboard_filters: {
"date": "Last 6 Years",
"state": ""
},
absoluteUrl: "https://self-signed.looker.com:9999/embed/dashboards/1?embed_domain=https%3A%2F%2Fself-signed.looker.com%3A9999&date=Last+6+Years&state=",
url: "/embed/dashboards/1?embed_domain=https%3A%2F%2Fself-signed.looker.com%3A9999&date=Last+6+Years&state=",
options: {
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
status |
String | Indica si el panel y sus elementos se cargaron correctamente. |
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.options |
Objeto | Las propiedades y los valores de diseño del panel, componente de diseño del panel y elemento del panel Todas las propiedades que se muestran en el objeto options pueden recibir valores actualizados con el evento dashboard:options:set . |
dashboard:run:start
Este evento se crea cuando comienza la carga de un panel, cuando sus tarjetas comenzarán a cargar y consultar datos.
type: "dashboard:run:start",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard:run:complete
Este evento se crea cuando un panel finaliza su ejecución y todos los mosaicos terminan de cargarse y realizar consultas. Este evento se crea independientemente de si todas las tarjetas se cargan correctamente.
type: "dashboard:run:complete",
status: "complete",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://my.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
options: {
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
status |
String | Indica si el panel y sus elementos se ejecutaron correctamente. Si el panel y sus elementos se ejecutaron correctamente, status devuelve "complete" ; de lo contrario, status devuelve "error" . Si se detuvo el panel en ejecución, ya sea desde la interfaz de usuario o con la acción dashboard:stop , status devolverá "stopped" . |
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard.options |
Objeto | Las propiedades y los valores de diseño del panel, componente de diseño del panel y elemento del panel Todas las propiedades que se muestran en el objeto options pueden recibir valores actualizados con la acción dashboard:options:set . |
dashboard.tileStatuses |
Array de objetos | Es un array de objetos que proporciona estados de mosaicos. Las propiedades del objeto son las siguientes:
|
dashboard:download
Este evento se crea cuando se inicia la descarga de un PDF de un panel.
type: "dashboard:download",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
fileFormat: "pdf"
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
fileFormat |
String | Es el formato del panel descargado (solo "pdf" por el momento). |
dashboard:edit:start
Se agregó en la versión 22.20 Este evento se crea cuando un panel cambia al modo de edición.
type: "dashboard:edit:start",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard:edit:cancel
Se agregó en la versión 22.20 Este evento se crea cuando se sale del modo de edición de un panel sin guardar.
type: "dashboard:edit:cancel",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard:save:complete
Este evento se crea cuando se edita y, luego, se guarda un panel.
type: "dashboard:save:complete",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
url: "/embed/dashboards/...",
options: {
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.options |
Objeto | Las propiedades y los valores de diseño del panel, componente de diseño del panel y elemento del panel Todas las propiedades que se muestran en el objeto options pueden recibir valores actualizados con el evento dashboard:options:set . |
dashboard:delete:complete
Este evento se crea cuando se borra un panel.
type: "dashboard:delete:complete",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
url: "/embed/dashboards/...",
options: {
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.options |
Objeto | Las propiedades y los valores de diseño del panel, componente de diseño del panel y elemento del panel Todas las propiedades que se muestran en el objeto options pueden recibir valores actualizados con el evento dashboard:options:set . |
dashboard:tile:start
Este evento se crea cuando una tarjeta comienza a cargar o consultar datos.
type: "dashboard:tile:start",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
tile: {
id: 123,
title: "Quarterly Sales",
listen: {
"Date": "order.date",
"Total Orders": "order.count"
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
tile.id |
Número entero | Es el número de ID del evento, no de la tarjeta. |
tile.title |
String | Es el título de la tarjeta, tal como se muestra en la parte superior de la tarjeta. |
tile.listen |
Objeto | Son los filtros del panel global que escucha este mosaico. Este objeto tiene el siguiente formato: {"Filter Label": "Filter Field", ...} |
dashboard:tile:complete
Este evento se crea cuando una segmentación finalizó la ejecución de la consulta.
type: "dashboard:tile:complete",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
status: "complete",
truncated: false,
tile: {
id: 123,
title: "Quarterly Sales",
listen: {
"Date": "order.date",
"Total Orders": "order.count"
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
status |
String | Indica si la consulta de la tarjeta se completó correctamente. Los valores posibles son "complete" o "error" . |
truncated |
Booleano | Indica si los resultados de la consulta de la tarjeta se truncaron porque la consulta devolvió más filas que el límite de filas de la consulta. El límite de filas puede ser un límite especificado por el usuario o el límite predeterminado de Looker de 5,000 filas. |
tile.id |
Número entero | Es el número de ID del evento, no de la tarjeta. |
tile.title |
String | Es el título de la tarjeta, tal como se muestra en la parte superior de la tarjeta. |
tile.listen |
Objeto | Son los filtros del panel global que escucha este mosaico. Este objeto tiene el siguiente formato: {"Filter Label": "Filter Field", ...} |
tile.errors |
Array de objetos | Se propaga cuando la propiedad status es "error" . Es un array de objetos que proporciona detalles del error, incluido el texto del mensaje de error, una descripción más detallada del error y la consulta en SQL de la tarjeta que produjo el error. |
dashboard:tile:download
Este evento se crea cuando se inicia la descarga de los datos de una tarjeta.
type: "dashboard:tile:download",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
tile: {
id: 123,
title: "Quarterly Sales"
listen: {
"Date": "order.date",
"Total Orders": "order.count"
}
}
fileFormat: "pdf"
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
tile.id |
Número entero | Es el número de ID del evento, no de la tarjeta. |
tile.title |
String | Es el título de la tarjeta, tal como se muestra en la parte superior de la tarjeta. |
tile.listen |
Objeto | Son los filtros del panel global que escucha este mosaico. Este objeto tiene el siguiente formato: {"Filter Label": "Filter Field", ...} |
fileFormat |
String | Es el formato de la segmentación descargada (solo "pdf" por el momento). |
dashboard:tile:explore
Este evento se crea cuando un usuario hace clic en la opción Explorar desde aquí en un campo del panel.
type: "dashboard:tile:explore",
label: 'Explore From Here',
url: '/embed/explore/model/view...',
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
tile: {
id: 123,
title: "Quarterly Sales",
listen: {
"Date": "order.date",
"Total Orders": "order.count"
}
}
Atributo | Formato | Descripción |
---|---|---|
label |
String | Es la etiqueta del botón. |
url |
String | Es la URL relativa (solo la ruta de acceso) del Explorar que se visualizará. |
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
tile.id |
Número entero | Es el número de ID del evento, no de la tarjeta. |
tile.title |
String | Es el título de la tarjeta, tal como se muestra en la parte superior de la tarjeta. |
tile.listen |
Objeto | Son los filtros del panel global que escucha este mosaico. Este objeto tiene el siguiente formato: {"Filter Label": "Filter Field", ...} |
dashboard:tile:view
Este evento se crea cuando un usuario hace clic en la opción Ver aspecto original en una tarjeta del panel.
type: "dashboard:tile:view",
label: 'View Original Look',
url: '/embed/look/...',
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
tile: {
id: 123,
title: "Quarterly Sales",
listen: {
"Date": "order.date",
"Total Orders": "order.count"
}
}
Atributo | Formato | Descripción |
---|---|---|
label |
String | Es la etiqueta del botón. |
url |
String | Es la URL relativa (solo la ruta de acceso) del Look que se visualizará. |
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
tile.id |
Número entero | Es el número de ID del evento, no de la tarjeta. |
tile.title |
String | Es el título de la tarjeta, tal como se muestra en la parte superior de la tarjeta. |
tile.listen |
Objeto | Son los filtros del panel global que escucha este mosaico. Este objeto tiene el siguiente formato: {"Filter Label": "Filter Field", ...} |
dashboard:filters:changed
Este evento se crea cuando se aplican o cambian los filtros de un panel.
type: "dashboard:filters:changed",
dashboard: {
id: 23,
title: "My Dashboard",
canEdit: true,
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/...",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
options: {
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel. |
dashboard.title |
String | Es el título que se muestra en la parte superior del panel. |
dashboard.canEdit |
Booleano |
Se agregó en la versión 22.20
Cuando es true , el usuario puede editar el panel. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso). |
dashboard.absoluteUrl |
String | Es la URL completa del panel. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard.options |
Objeto | Las propiedades y los valores de diseño del panel, componente de diseño del panel y elemento del panel Todas las propiedades que se muestran en el objeto options pueden recibir valores actualizados con el evento dashboard:options:set . |
look:ready
Este evento se crea cuando un Look comienza a cargar datos de la consulta, ya sea que la consulta se ejecute o no.
type: "look:ready",
look: {
url: "/embed/looks/...",
absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
}
Atributo | Formato | Descripción |
---|---|---|
look.url |
String | La URL relativa de Look (solo la ruta) |
look.absoluteUrl |
String | La URL completa de Look |
look:run:start
Este evento se crea cuando una vista comienza a cargar datos de la consulta y la consulta comienza a ejecutarse.
type: "look:run:start",
look: {
url: "/embed/looks/...",
absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
}
Atributo | Formato | Descripción |
---|---|---|
look.url |
String | La URL relativa de Look (solo la ruta) |
look.absoluteUrl |
String | La URL completa de Look |
look:run:complete
Este evento se crea cuando un Look termina de ejecutar la consulta.
type: look:run:complete
look: {
url: "/embed/looks/...",
absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
}
Atributo | Formato | Descripción |
---|---|---|
look.url |
String | La URL relativa de Look (solo la ruta) |
look.absoluteUrl |
String | La URL completa de Look |
look:edit:start
Se agregó el 25/10 Este evento se activa cuando se cambia un Look al modo de edición.
type: "look:edit:start",
look: {
id: 46,
title: "My Look",
url: "/embed/looks/46",
absoluteUrl: "https://instance_name.looker.com/embed/looks/46",
}
Atributo | Formato | Descripción |
---|---|---|
look.id |
String | Es el ID del Look. |
look.title |
String | Es el título del Look. |
url |
String | Es la URL relativa de Look (solo la ruta de acceso). |
absoluteUrl |
String | Es la URL completa del Look. |
look:edit:cancel
Se agregó en la versión 25.10 Este evento se activa cuando se sale del modo de edición de un Look sin guardar.
type: "look:edit:cancel",
look: {
id: 46,
title: "My Look",
url: "/embed/looks/46",
absoluteUrl: "https://instance_name.looker.com/embed/looks/46",
}
Atributo | Formato | Descripción |
---|---|---|
look.id |
String | Es el ID del Look. |
look.title |
String | Es el título del Look. |
url |
String | Es la URL relativa de Look (solo la ruta de acceso). |
absoluteUrl |
String | Es la URL completa del Look. |
look:save:complete
Este evento se crea cuando se edita y guarda un Look. Este evento se crea cuando un usuario realiza una de las siguientes tareas:
- Hace clic en el botón Editar para editar el Look y, luego, hace clic en Guardar.
- Guardar un Look con la opción de menú Guardar > Guardar como…
- Mueve un Look de una carpeta a otra
Este evento no se crea si la vista se guarda con la opción de menú Guardar > En un panel existente o Editar configuración.
type: look:save:complete
look: {
url: "/embed/looks/...",
absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
folderid: 123
}
Atributo | Formato | Descripción |
---|---|---|
look.url |
String | La URL relativa de Look (solo la ruta) |
look.absoluteUrl |
String | La URL completa de Look |
look.folderid |
Número entero | ID de la carpeta en la que se almacena el Look |
look:delete:complete
Este evento se crea cuando una vista se mueve a la carpeta de la Papelera.
type: look:delete:complete
look: {
url: "/embed/looks/...",
absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
}
Atributo | Formato | Descripción |
---|---|---|
look.url |
String | La URL relativa de Look (solo la ruta) |
look.absoluteUrl |
String | La URL completa de Look |
drillmenu:click
Este evento se crea cuando un usuario hace clic en un menú de desglose en un panel creado con el parámetro de LookML link
. Por ejemplo, el siguiente LookML crea un menú de exploración en el que un usuario puede ver los datos filtrados por la dimensión state
:
dimension: state {
type: string
sql: ${TABLE}.state ;;
link: {
label: "Filter by {{ state | encode_uri }}"
url: "filter::q={{ state | encode_uri }}"
icon_url: "https://google.com/favicon.ico"
}
}
Cuando el filtro state
se establece en Illinois
, el evento drillmenu:click
devuelve lo siguiente al host del iframe:
type: "drillmenu:click",
label: "Filter by Illinois",
link_type: "url",
modal: false,
target: '_self',
url: "#filter::state=Illinois"
context: ' '
Atributo | Formato | Descripción |
---|---|---|
label |
String | La etiqueta del vínculo, tal como se muestra en el menú de desglose |
link_type |
String | Tipo de objeto en el destino del vínculo |
modal |
Booleano | Indica si se usará el diálogo de desglose en lugar de la navegación del navegador. |
target |
String | Es _self si el destino del vínculo reemplazará el iframe actual o _blank si el destino del vínculo abrirá una ventana nueva. |
url |
String | URL del destino del vínculo |
context |
String | Es un atributo interno que usan algunos tipos de visualizaciones. |
Aislar el iframe evitará que los clics en el menú de desglose se abran en una ventana nueva. Usa estos valores de zona de pruebas dentro de la etiqueta iframe:
sandbox = "allow-same-origin allow-scripts"
drillmodal:download
Este evento se crea cuando un usuario abre un diálogo de desglose desde una tarjeta del panel y hace clic en la opción Descargar.
{
type: "drillmodal:download",
dashboard: {
id: 23,
title: "My Dashboard",
url: "/embed/dashboards/…",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/…",
dashboard_filters: {
"Date": "Last 28 days",
"Total Orders": "Greater than 100"
}
}
drillExploreUrl: "/embed...",
fileFormat: "pdf"
}
Atributo | Formato | Descripción |
---|---|---|
dashboard.id |
Número/cadena | Es el ID del panel al que pertenece la tarjeta. |
dashboard.title |
String | Es el título del panel, tal como se muestra en la parte superior del panel al que pertenece la tarjeta. |
dashboard.url |
String | Es la URL relativa del panel (solo la ruta de acceso) al que pertenece la tarjeta. |
dashboard.absoluteUrl |
String | Es la URL completa del panel al que pertenece la tarjeta. |
dashboard.dashboard_filters |
Objeto | Son los filtros aplicados al panel al que pertenece la tarjeta. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
drillExploreUrl |
String | Es la URL relativa de Explorar (solo la ruta de acceso) que se descargará. |
fileFormat |
String | Es el formato de archivo de la descarga de datos. |
drillmodal:explore
Este evento se crea cuando un usuario hace clic en la opción Explorar desde aquí en un diálogo de desglose.
type: "drillmodal:explore",
label: "Explore From Here",
url: "/embed/explore/model/view..."
Atributo | Formato | Descripción |
---|---|---|
label |
String | La etiqueta del botón tal como se muestra en el menú de desglose |
url |
String | Es la URL relativa de Explorar (solo la ruta) que se visualizará. |
explore:ready
Este evento se crea cuando un Explorar comienza a cargar datos de la consulta, ya sea que la consulta se ejecute o no.
type: "explore:ready",
explore: {
url: "/embed/explore/...",
absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
}
Atributo | Formato | Descripción |
---|---|---|
explore.url |
String | Es la URL relativa de Explorar (solo la ruta de acceso). |
explore.absoluteUrl |
String | La URL completa de Explorar |
explore:run:start
Este evento se crea cuando un Explorar comienza a cargar datos de la consulta y esta comienza a ejecutarse.
type: "explore:run:start",
explore: {
url: "/embed/explore/...",
absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
}
Atributo | Formato | Descripción |
---|---|---|
explore.url |
String | Es la URL relativa de Explorar (solo la ruta de acceso). |
explore.absoluteUrl |
String | La URL completa de Explorar |
explore:run:complete
Este evento se crea cuando un Explorador termina de ejecutar la consulta.
type: "explore:run:complete",
explore: {
url: "/embed/explore/...",
absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
}
}
Atributo | Formato | Descripción |
---|---|---|
explore.url |
String | Es la URL relativa de Explorar (solo la ruta de acceso). |
explore.absoluteUrl |
String | La URL completa de Explorar |
explore:state:changed
Este evento se crea cuando cambia la URL de una página de Explorar como resultado de las acciones del usuario.
type: "explore:state:changed",
explore: {
url: "/embed/explore/...",
absoluteUrl: "https://instance_name.looker.com/embed/explore/..."
}
Atributo | Formato | Descripción |
---|---|---|
explore.url |
String | Es la URL relativa de Explorar (solo la ruta de acceso). |
explore.absoluteUrl |
String | La URL completa de Explorar |
page:changed
Este evento se crea cuando un usuario navega a una página nueva dentro del iframe.
type: "page:changed",
page: {
type: "dashboard",
url: "/embed/dashboards/...",
absoluteUrl: "https://instance_name.looker.com/embed/dashboards/..."
}
Atributo | Formato | Descripción |
---|---|---|
page.type |
String | Es el tipo de página a la que se acaba de navegar, como "dashboard" , "look" o "explore" . |
page.url |
String | Es la URL relativa (solo la ruta de acceso) de la página a la que se acaba de navegar. |
page.absoluteUrl |
String | Es la URL completa de la página a la que se acaba de navegar. |
page:properties:changed
Este evento se crea cuando cambia la altura de un iframe del panel. No está disponible para Looks ni Explorar, ya que estos elementos ajustan automáticamente su altura al tamaño del iframe.
type: "page:properties:changed",
height: 1000
Atributo | Formato | Descripción |
---|---|---|
height |
Número entero | Altura del iframe del panel en píxeles |
session:tokens
Este evento indica que el cliente de Looker requiere tokens para continuar. Este evento se crea inmediatamente después de la creación del iframe y, luego, periódicamente durante la sesión.
{
"type": "session:tokens",
"api_token": "eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwczovL3NlbGYtc2lnbmVkLmxvb2tlci5jb206OTk5OSIsImV4cCI6MTY3MDYyNjMzMCwic3ViIjoiYVdrNWFGUzM4RnRwNzFFWXhuS3ZaMXdKRmV3ZjB2VzYtTV9zLWtCcHE1dXIiLCJ0b2tlbl90eXBlIjoiYXBpX3Rva2VuIiwicmFuZG9taXplciI6IkxjYnpOeDNTVjNOb3o3UVlqTVJjNmhlMkdodjh1a2UwWUhiZWNRMHVCYm1KIn0.CBv1__QGc_H7bKNe31SHMMQCsc5ya1xOiEv1UDWAyxM",
"api_token_ttl": 463,
"navigation_token": "eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJodHRwczovL3NlbGYtc2lnbmVkLmxvb2tlci5jb206OTk5OSIsImV4cCI6MTY3MDYyNjMzMCwic3ViIjoiYVdrNWFGUzM4RnRwNzFFWXhuS3ZaMXdKRmV3ZjB2VzYtTV9zLWtCcHE1dXIiLCJ0b2tlbl90eXBlIjoibmF2aWdhdGlvbl90b2tlbiIsInJhbmRvbWl6ZXIiOiJHVVNlc00tdTRPRDlNdktodFJDU2pEcVFhUkJNeTh5dm42Q1FDUXhuLTNxMiJ9.sWo7LUEI5LeragVmeDamUR7u2myXpFJ0aqK_IIALUqI",
"navigation_token_ttl": 463,
"session_reference_token_ttl": 2924
}
Atributo | Formato | Descripción |
---|---|---|
authentication_token |
String | Es el token de autenticación. Se incluye cuando se crea el iframe. No se incluye con una respuesta a una solicitud para generar tokens ni si la sesión venció. |
authentication_token_ttl |
Número | Es el tiempo de actividad del token de autenticación en segundos. Se incluye cuando se crea el iframe. No se incluye con una respuesta a una solicitud para generar tokens ni si la sesión venció. |
api_token |
String | Es el token de API. No se incluye si la sesión venció. |
api_token_ttl |
Número | Es el tiempo de actividad del token de la API en segundos. No se incluye si la sesión venció. |
navigation_token |
String | Es un token de navegación. No se incluye si la sesión venció. |
navigation_token_ttl |
Número | Es el tiempo de actividad del token de navegación en segundos. No se incluye si la sesión venció. |
session_references_token_ttl |
Número | Es el tiempo de actividad de la sesión en segundos. El valor será 0 cuando la sesión haya vencido. Para recuperarse, la aplicación de incorporación debe adquirir una nueva sesión. |
session:expired
Se agregó el 25/10 Este evento se activa cuando vence la sesión del usuario integrado.
type: "session:expired",
Este evento no tiene carga útil.
session:status
El evento se genera cuando la aplicación de Looker integrada controla las solicitudes de tokens de sesión.
{
"type": "session:status",
"session_ttl": 0,
"expired": true,
"interrupted": false
}
Atributo | Formato | Descripción |
---|---|---|
session_ttl |
Número | Es el tiempo de actividad de la sesión en segundos. |
expired |
Booleano | Cuando es true , indica que la sesión venció. |
interrupted |
Booleano | Cuando es true , indica que no se respondió a una solicitud de tokens de sesión. Esto podría indicar que un servidor no está disponible temporalmente. |
recoverable |
Booleano | Solo se propaga cuando interrupted es true . Indica si se puede recuperar la sesión. Un valor de false probablemente significa que hay un problema con la aplicación de la incorporación. |
env:client:dialog
El evento se genera cuando se abre un diálogo que puede estar parcialmente fuera de la vista, como un diálogo de desglose. Este evento permite que la aplicación de hosting desplace el diálogo a la vista con la acción env:host:scroll
.
{
type: "env:client:dialog",
dialogType: 'drilling',
placement: 'cover',
open: true
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | env:client:dialog indica que se abrió o cerró un diálogo. Solo se admite el diálogo de desglose, pero es posible que se agreguen otros diálogos en el futuro. Es posible que la parte superior del diálogo de desglose no esté a la vista, ya que el diálogo cubre el viewport del iframe. Este evento permite que la aplicación host desplace la parte superior del diálogo a la vista. |
dialogType |
String | Es el tipo de diálogo. Solo la apertura o el cierre del tipo de diálogo de "exploración" activan este evento. |
placement |
String | Es la posición del diálogo. Los diálogos de tipo "drilling" siempre usan un placement de "cover". |
open |
Booleano | Indica si el diálogo se abrió o se desplazó. |
Realiza cambios en el iframe
Después de preparar tu iframe para la recuperación de datos, puedes realizar cambios en él con los siguientes pasos:
Cómo escribir tu solicitud en JSON
Puedes realizar varios cambios en el iframe, que enviarás en formato JSON. Las opciones disponibles se describen en la sección Referencia de acciones de esta página. No olvides usar JSON.stringify
para convertir tu acción en JSON, de la siguiente manera:
var my_request = JSON.stringify(
{
type: "dashboard:run"
}
);
Publicar la solicitud en la propiedad contentWindow
del iframe
Por último, publica tu mensaje en el contentWindow
del iframe, de la siguiente manera:
var my_iframe = document.getElementById("my_iframe_id");
my_iframe.contentWindow.postMessage(my_request, 'https://instance_name.looker.com');
Tabla de resumen de acciones
En la siguiente tabla, se resumen las acciones. Selecciona una acción para ver sus detalles.
Acción | Descripción de la acción |
---|---|
page:load |
Carga una página nueva en el iframe y reemplaza la página existente. |
dashboard:load |
Carga un panel nuevo en el iframe y reemplaza uno existente. |
dashboard:run |
Ejecuta el panel en el iframe. |
dashboard:edit |
Se agregó en la versión 22.20 Cambia el panel al modo de edición. |
dashboard:filters:update |
Actualiza un filtro de panel existente en el iframe. |
dashboard:options:set |
Escribe valores nuevos en el diseño del panel y en las propiedades de los elementos del panel. |
dashboard:schedule_modal:open |
Abre el Programador, que permite a los usuarios enviar contenido de Looker a varios destinos. |
dashboard:stop |
Detiene un panel que está ejecutando o recargando datos. |
look:run |
Ejecuta la función de Look en el iframe. |
look:filters:update |
Actualiza un filtro de aspecto existente en el iframe. |
explore:run |
Ejecuta la función Explorar en el iframe. |
explore:filters:update |
Actualiza o quita un filtro de Explorar existente en el iframe. |
session:tokens:request |
Envía tokens en respuesta a un evento session:tokens:request . |
env:host:scroll |
Envía información sobre la posición de desplazamiento actual del iframe host a la aplicación de Looker incorporada. |
Referencia de acción
Estas son las acciones disponibles que puedes publicar en el iframe incorporado:
page:load
Usa esta acción para navegar a contenido nuevo dentro del iframe y reemplazar el contenido existente. Esta acción es similar a la acción dashboard:load
, pero es más flexible, ya que se pueden especificar parámetros adicionales en la URL.
Existen diferencias en el comportamiento que se deben tener en cuenta antes de usar page:load
. dashboard:load
evitará que se produzca la navegación si se está editando el panel actual. page:load
no impide que se produzca la navegación. La aplicación host puede determinar si se está editando un panel o una Look haciendo un seguimiento de dashboard:edit:start
, look:edit:start
y sus eventos de finalización de edición correspondientes. Por este motivo, te recomendamos que uses el SDK de integración. El SDK de incorporación hace un seguimiento de si se está editando un panel o una Look, por lo que se puede consultar la conexión para ver si se está editando contenido antes de la navegación.
{
type: 'page:load',
url: '/embed/dashboard/32?state=california,
pushHistory: false
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo page:load indica que deseas cargar contenido nuevo en el iframe. |
url |
String | Es la URL del contenido que se cargará. |
pushHistory |
Booleano | Si es true , el contenido cargado crea una nueva entrada en el historial del navegador, y el usuario puede usar el botón Atrás del navegador para volver al contenido anterior. Si es false , se reemplaza el contenido actual y no se puede usar la navegación del navegador para volver a él. |
dashboard:load
Usa esta acción para cargar un panel nuevo en el iframe y reemplazar un panel existente. El nuevo panel comenzará a ejecutar consultas como si se hubiera abierto una nueva página del panel.
{
type: "dashboard:load",
id: "101",
pushHistory: false
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:load indica que deseas cargar un panel nuevo en el iframe. |
id |
String | ID del panel que se cargará. |
pushHistory |
Booleano | Si es true , el panel que se carga crea una nueva entrada en el historial del navegador, y el usuario puede usar el botón Atrás del navegador para volver al panel anterior. Si es false , se reemplaza el panel actual y no se puede usar la navegación del navegador para volver a él. |
dashboard:run
Usa esta acción para ejecutar el panel en el iframe. Esta acción es la misma que presionar el botón Ejecutar o Volver a cargar los datos en el panel.
{
type: "dashboard:run"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:run indica que deseas ejecutar el panel. |
dashboard:edit
Se agregó en la versión 22.20 Usa esta acción para cambiar un panel existente en el iframe al modo de edición. Esta acción es la misma que seleccionar Editar panel en el menú del panel.
{
type: "dashboard:edit"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:edit indica que deseas cambiar el panel al modo de edición. |
dashboard:filters:update
Usa esta acción para actualizar un filtro de panel existente en el iframe. No puedes agregar un filtro nuevo al panel con este método.
{
type: "dashboard:filters:update",
filters: {
"Sale date": "Last 28 days",
"Sale amount": "Greater than 100"
}
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:filters:update indica que deseas actualizar los filtros que usa el panel. |
filters |
Objeto | Son los filtros nuevos que deseas aplicar al panel. Este objeto tiene el siguiente formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...} |
dashboard:options:set
Esta acción está disponible después de que ocurre el evento dashboard:run:complete
.
El incorporador crea el mensaje y lo envía al iframe, pero el panel no responde hasta después de que ocurre dashboard:run:complete
. La acción dashboard:options:set
escribe valores nuevos en el diseño del panel y en las propiedades de los elementos del panel. Solo se pueden actualizar las propiedades que se devolvieron en el atributo options
del evento dashboard:run:complete
con dashboard:options:set
. Se ignoran las propiedades establecidas que no devolvió anteriormente el atributo options
del evento dashboard:run:complete
.
{
type: "dashboard:options:set",
layouts: [
{
id: 1,
dashboard_id: 1,
type: "newspaper",
active: true,
column_width: null,
width: null,
deleted: false,
dashboard_layout_components: [
{
id: 1,
dashboard_layout_id: 1,
dashboard_element_id: 1,
row: 0,
column: 0,
width: 8,
height: 4,
deleted: false
},
{
id: 2,
dashboard_layout_id: 1,
dashboard_element_id: 2,
row: 0,
column: 8,
width: 8,
height: 4,
deleted: false
}
]
}
],
elements: {
1: {
title: "Total Orders",
title_hidden: false,
vis_config: {
type: "single_value",
font_size: "medium",
title: "Total Orders"
}
},
2: {
title: "Average Order Profit",
title_hidden: false,
vis_config: {
type: "single_value",
title: "Average Order Profit"
}
}
}
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:options:set indica que deseas escribir valores nuevos en las propiedades del diseño y los elementos del panel. |
layouts |
Objeto | Son las propiedades del diseño del panel que devuelve el atributo options en el evento dashboard:run:complete . Tendrán un formato similar al siguiente:
|
layouts.dashboard_layout_components |
Objeto | Uno o más objetos componente de diseño del panel que devuelve el atributo options en el evento dashboard:run:complete . Tendrán un formato similar al siguiente:
|
elements |
Objeto | Uno o más objetos elementos del panel que devuelve el atributo options en el evento dashboard:run:complete . Tendrán un formato similar al siguiente:id: { title: "string", title_hidden: boolean, vis_config: { type: "string", title: "string" }} |
dashboard:schedule_modal:open
Usa esta acción para abrir el Programador, que permite a los usuarios entregar contenido de Looker a varios destinos.
{
type: "dashboard:schedule_modal:open"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:schedule_modal:open indica que quieres abrir el diálogo Schedule. |
dashboard:stop
Usa esta acción para detener un panel que se está ejecutando o recargando datos. Esta acción es la misma que hacer clic en el botón Cancelar del panel. Un panel detenido con dashboard:stop
envía un evento dashboard:run:complete
con status:
establecido en "stopped"
.
{
type: "dashboard:stop"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo dashboard:stop indica que deseas detener el panel en ejecución. |
look:run
Usa esta acción para ejecutar la consulta en la que se basa el Look en el iframe. Esta acción es similar a presionar el botón Ejecutar en la vista, con la excepción de que look:run
siempre consulta la base de datos directamente y no recupera datos de la caché de Looker.
{
type: "look:run"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo look:run indica que deseas ejecutar la visualización. |
look:filters:update
Usa esta acción para actualizar un filtro de Look existente en el iframe. No puedes agregar un filtro nuevo a la visualización con este método.
{
type: "look:filters:update",
filters: {
"orders.created_at": "90 days",
"products.department": "sweaters"
}
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo look:filters:update indica que deseas actualizar los filtros que usa la Exploración. |
filters |
Objeto | Son los filtros nuevos que deseas aplicar al Look. Este objeto tiene el siguiente formato: {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...} |
explore:run
Usa esta acción para ejecutar la función Explorar en el iframe. Esta acción es similar a presionar el botón Ejecutar en Explorar, con la excepción de que explore:run
siempre consulta la base de datos directamente y no recupera datos de la caché de Looker.
{
type: "explore:run"
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo explore:run indica que deseas ejecutar la función Explorar. |
explore:filters:update
Usa esta acción para actualizar o quitar un filtro de Explorar existente en el iframe. Si incluyes un filtro nuevo que hace referencia a un campo válido, se agregará el filtro nuevo a Explorar.
{
type: "explore:filters:update",
filters: {
"orders.created_at": "90 days",
"orders.status": "complete"
}
deleteFilters: ["products.department"]
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo explore:filters:update indica que deseas actualizar los filtros que usa Explorar. |
filters |
Objeto | Son los filtros nuevos que deseas aplicar a Explorar. Si filters incluye un filtro que no existe en la Exploración, pero que hace referencia a un campo válido, ese filtro se agregará a la Exploración. Este objeto tiene el formato {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...} . |
deleteFilters |
Array | Son los filtros existentes que deseas quitar de Explorar. El array tiene el siguiente formato: ["view_name.field_name_1", "view_name.field_name_2", ...] |
session:tokens:request
Usa esta acción para enviar tokens en respuesta a una solicitud de session:tokens:request
.
{
type: "session:tokens:request",
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo session:tokens:request indica que deseas enviar tokens en respuesta a un evento session:tokens:request . |
env:host:scroll
Usa esta acción para enviar información sobre la posición de desplazamiento actual del iframe host a la aplicación de Looker integrada.
{
type: "env:host:scroll",
offsetTop: 10,
offsetLeft: 10,
scrollX: 5,
scrollY: 5
}
Atributo | Formato | Descripción |
---|---|---|
type |
String | Usar el tipo env:host:scroll indica que deseas enviar información sobre la posición de desplazamiento actual del iframe host a la aplicación de Looker integrada. |
offsetTop |
Número | Es el desplazamiento superior del iframe. |
offsetLeft |
Número | Es el desplazamiento hacia la izquierda del iframe. |
scrollX |
Número | Posición scrollX del host de la aplicación. |
scrollY |
Número | Posición de scrollY del host de la aplicación. |