Eventos de JavaScript insertados

Una vez que haya creado una inserción (que puede ser pública, privada, con inserción firmada o a través de la API), podrá interactuar con esos iframes mediante JavaScript. Puedes hacer que tu página sea más dinámica en función del estado del elemento insertado e incluso modificarlo desde tu página web.

Ten en cuenta que Looker no controla el orden en el 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 el código JavaScript correctamente para tener en cuenta la gestión de eventos de los distintos navegadores.

Puedes usar JavaScript de una de las siguientes formas para el contenido insertado de Looker:

Preparación

Para poder interactuar con el iframe insertado, sigue estos pasos:

Añadir un ID al iframe

Más adelante, cuando recupere datos del iframe, deberá validar que la información con la que está trabajando procede realmente del iframe de Looker. Para facilitar este proceso, añade un ID a tu iframe si aún no lo has hecho. En el siguiente ejemplo, se asigna el ID looker añadiendo id="looker" al iframe:

<iframe id="looker" src="https://instance_name.looker.com/embed/dashboards/1"></iframe>

Añadir el dominio de inserción al atributo src del iframe

En el atributo src del iframe, incluya el dominio en el que se está usando el iframe. En el siguiente ejemplo, puede especificar myownpersonaldomain.com como dominio añadiendo ?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 utilizas la inserción con firma, asegúrate de añadir el embed_domain a la URL de inserción.

Si usas el SDK de inserción, añade sdk=3 al final de la URL de inserció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 la transmisión de eventos de JavaScript entre el iframe de Looker y su dominio. El SDK no puede añadir este parámetro por sí mismo 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>

Añadir el dominio de inserción a la lista de permitidos

Por último, debes añadir el dominio en el que se usa el iframe a la lista de permitidos de la página Insertar del panel Administrador de Looker. Para ello, sigue estos pasos:

  1. En el campo Lista de permitidos de dominios insertados, introduzca el dominio en el que se está usando el iframe y, a continuación, pulse la tecla Tab para que el dominio aparezca en un cuadro dentro del campo.

  2. Haz clic en Actualizar.

Puedes usar el comodín * en la lista de permitidas para crear un patrón de dominio. Por ejemplo, https://*.myownpersonaldomain.com permitiría tanto https://analytics.myownpersonaldomain.com como https://data.myownpersonaldomain.com.

Si usas la inserción sin cookies con Looker 23.8 o una versión posterior, el dominio de inserción se puede especificar cuando se adquiere la sesión sin cookies. Esta es una alternativa a añadir el dominio de inserción a la lista de permitidos mediante el panel Administrar > Insertar. Consulta las prácticas recomendadas de seguridad si decides aprovechar esta función.

Obtener datos del iframe

Una vez que hayas completado los pasos de preparación, podrás acceder a los eventos que se transfieren entre el iframe de Looker y tu dominio. Para ello, debes procesar los eventos postMessage.

El iframe insertado puede crear varios tipos de eventos, tal como se describe en la sección Referencia de tipos de eventos de esta página.

Acceder a eventos en JavaScript

A continuación, se muestra un ejemplo de cómo procesar estos eventos en JavaScript y, a continuación, 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, después, 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 de tipos de eventos

En la siguiente tabla se resumen los tipos de eventos. Selecciona un tipo de evento para ver los detalles correspondientes.

Tipo de evento Causa del evento
dashboard:loaded En los paneles de control en los que las tarjetas no están configuradas para ejecutarse automáticamente, el panel y sus elementos se han cargado, pero las consultas aún no se están ejecutando.
dashboard:run:start Se ha empezado a cargar un panel de control y sus baldosas han empezado a cargarse y a consultar datos.
dashboard:run:complete Un panel de control ha terminado de ejecutarse y todos los baldosines han terminado de cargarse y de consultar.
dashboard:download Se ha iniciado la descarga de un PDF de un panel de control.
dashboard:edit:start Added 22.20 Se ha cambiado un panel de control al modo de edición. El evento dashboard:save:complete se activará cuando el panel de control se haya guardado correctamente.
dashboard:edit:cancel Added 22.20 Se ha salido del modo de edición de un panel sin guardar los cambios.
dashboard:save:complete Se ha editado y guardado un panel de control.
dashboard:delete:complete Se ha eliminado un panel de control.
dashboard:tile:start Se ha empezado a cargar o consultar datos de una baldosa.
dashboard:tile:complete Un recuadro ha terminado de ejecutar la consulta.
dashboard:tile:download Se ha empezado a descargar la información de una baldosa.
dashboard:tile:explore Un usuario ha hecho clic en la opción Explorar desde aquí de una baldosa del panel de control.
dashboard:tile:merge Added 25.14 Un usuario ha hecho clic en el botón o en el elemento de menú Editar consulta combinada.
dashboard:tile:view Un usuario ha hecho clic en la opción Ver aspecto original de una baldosa del panel de control.
dashboard:filters:changed Se han aplicado o cambiado los filtros de un panel de control.
look:ready Una vista ha empezado a cargar datos de consulta, independientemente de si la consulta se ejecutará o no.
look:run:start Un Look ha empezado a cargar los datos de la consulta y esta ha empezado a ejecutarse.
look:run:complete Un Look ha terminado de ejecutar la consulta.
look:edit:start Añadido el 25/10 Se ha cambiado un Look al modo de edición. El evento look:save:complete se activará cuando se guarde el look.
look:edit:cancel Añadido el 25/10 Se ha salido del modo de edición de un look sin guardar los cambios.
look:save:complete Se ha editado y guardado un Look.
look:delete:complete Se ha movido un Look a la carpeta Papelera.
drillmenu:click Un usuario ha hecho clic en un menú de desglose de un panel de control que se ha creado con el link parámetro LookML.
drillmodal:download Un usuario ha abierto un cuadro de diálogo de desglose desde una baldosa de un panel de control y ha hecho clic en la opción Descargar.
drillmodal:explore Un usuario ha hecho clic en la opción Explorar desde aquí en un cuadro de desglose.
explore:ready Una exploración ha empezado a cargar datos de consulta, independientemente de si la consulta se ejecutará o no.
explore:run:start Una exploración ha empezado a cargar datos de consulta y la consulta ha empezado a ejecutarse.
explore:run:complete Un Exploración ha terminado de ejecutar la consulta.
explore:state:changed La URL de una página Explorar ha cambiado como resultado de las acciones del usuario.
page:changed Un usuario ha accedido a una página nueva en el iframe.
page:properties:changed La altura de un iframe de un panel de control ha cambiado.
session:tokens El cliente de Looker necesita tokens para continuar.
session:expired Añadido el 25/10 La sesión del usuario ha caducado.
session:status Envía información sobre el estado de una sesión.
env:client:dialog Se ha abierto un cuadro de diálogo que puede estar parcialmente fuera de la vista, como un cuadro de diálogo de desglose. Este evento permite que la aplicación de alojamiento desplace el cuadro de diálogo para que se vea.

Referencia de tipos de eventos

El iframe insertado puede crear muchos tipos de eventos diferentes:

dashboard:loaded

En los paneles de control en los que las tarjetas no están configuradas para ejecutarse automáticamente, este evento se crea después de que se hayan cargado el 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 Cadena Indica si el panel de control y sus elementos se han cargado correctamente.
dashboard.id Número o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.options Objeto Las propiedades y los valores de diseño del panel de control, componente de diseño del panel de control y elemento del panel de control. Todas las propiedades devueltas en el objeto options pueden recibir valores actualizados mediante el evento dashboard:options:set.

dashboard:run:start

Este evento se crea cuando se ha empezado a cargar un panel de control, momento en el que sus baldosas empezarán a cargarse y a 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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.

dashboard:run:complete

Este evento se crea cuando un panel de control ha terminado de ejecutarse y todos los baldosines han terminado de cargarse y de enviar consultas. Este evento se crea independientemente de si todas las baldosas se cargan correctamente o no.

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 Cadena Indica si el panel de control y sus elementos se han ejecutado correctamente. Si el panel de control y sus elementos se han ejecutado correctamente, status devuelve "complete"; de lo contrario, status devuelve "error". Si el panel de control en ejecución se ha detenido, ya sea desde la interfaz de usuario o con la acción dashboard:stop, status devolverá "stopped".
dashboard.id Número o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
dashboard.options Objeto Las propiedades y los valores de diseño del panel de control, componente de diseño del panel de control y elemento del panel de control. Todas las propiedades devueltas en el objeto options pueden recibir valores actualizados mediante la acción dashboard:options:set.
dashboard.tileStatuses Matriz de objetos Es un array de objetos que proporcionan estados de las baldosas. Las propiedades del objeto son las siguientes:

  • tileId: el número de ID de la baldosa.
  • status: si la consulta de teselas se ha ejecutado correctamente, status devuelve "complete"; de lo contrario, status devuelve "error".
  • errors: se rellena cuando la propiedad status es "error". Es un array de objetos que proporciona detalles sobre el error, como el texto del mensaje de error, una descripción más detallada del error y la consulta SQL del gráfico que ha provocado el error.

dashboard:download

Este evento se crea cuando se ha empezado a descargar un PDF de un panel de control.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
fileFormat Cadena El formato del panel de control descargado (solo "pdf" por el momento).

dashboard:edit:start

Añadido el 22/20 Este evento se crea cuando se activa el modo de edición de un panel de control.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.

dashboard:edit:cancel

Añadido en la versión 22.20 Este evento se crea cuando se sale del modo de edición de un panel sin guardar los cambios.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.

dashboard:save:complete

Este evento se crea cuando se edita y se guarda un panel de control.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.options Objeto Las propiedades y los valores de diseño del panel de control, componente de diseño del panel de control y elemento del panel de control. Todas las propiedades devueltas en el objeto options pueden recibir valores actualizados mediante el evento dashboard:options:set.

dashboard:delete:complete

Este evento se crea cuando se elimina un panel de control.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.options Objeto Las propiedades y los valores de diseño del panel de control, componente de diseño del panel de control y elemento del panel de control. Todas las propiedades devueltas en el objeto options pueden recibir valores actualizados mediante el evento dashboard:options:set.

dashboard:tile:start

Este evento se crea cuando un gráfico empieza a cargar o a 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 o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
tile.id Entero El número de ID del evento, no de la baldosa.
tile.title Cadena El título de la baldosa, tal como se muestra en la parte superior de la baldosa.
tile.listen Objeto Los filtros del panel de control global que escucha este tile. Este objeto tiene el formato {"Filter Label": "Filter Field", ...}.

dashboard:tile:complete

Este evento se crea cuando una baldosa ha terminado de ejecutar 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 o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
status Cadena Indica si la consulta de la loseta se ha completado correctamente. Los valores posibles son "complete" o "error".
truncated Booleano Indica si los resultados de la consulta de la baldosa se han truncado porque la consulta ha devuelto más filas que el límite de filas de la consulta. El límite de filas puede ser el que haya especificado el usuario o el límite de filas predeterminado de Looker,que es de 5000.
tile.id Entero El número de ID del evento, no de la baldosa.
tile.title Cadena El título de la baldosa, tal como se muestra en la parte superior de la baldosa.
tile.listen Objeto Los filtros del panel de control global que escucha este tile. Este objeto tiene el formato {"Filter Label": "Filter Field", ...}.
tile.errors Matriz de objetos Se rellena cuando la propiedad status es "error". Es un array de objetos que proporciona detalles sobre el error, como el texto del mensaje de error, una descripción más detallada del error y la consulta SQL del gráfico que ha provocado el error.

dashboard:tile:download

Este evento se crea cuando se ha empezado a descargar los datos de una baldosa.

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 o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
tile.id Entero El número de ID del evento, no de la baldosa.
tile.title Cadena El título de la baldosa, tal como se muestra en la parte superior de la baldosa.
tile.listen Objeto Los filtros del panel de control global que escucha este tile. Este objeto tiene el formato {"Filter Label": "Filter Field", ...}.
fileFormat Cadena El formato de la baldosa descargada (por el momento, solo "pdf").

dashboard:tile:explore

Este evento se crea cuando un usuario hace clic en la opción Explorar desde aquí de una baldosa de un panel de control.

Este evento se puede cancelar, lo que significa que la aplicación insertada puede devolver {cancel: true} y Looker no continuará con el evento activador.

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 Cadena La etiqueta del botón.
url Cadena La URL relativa (solo la ruta) de la Exploración que se va a ver.
dashboard.id Número o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
tile.id Entero El número de ID del evento, no de la baldosa.
tile.title Cadena El título de la baldosa, tal como se muestra en la parte superior de la baldosa.
tile.listen Objeto Los filtros del panel de control global que escucha este tile. Este objeto tiene el formato {"Filter Label": "Filter Field", ...}.

dashboard:tile:view

Este evento se crea cuando un usuario hace clic en la opción Ver aspecto original de una baldosa de un panel de control.

Este evento se puede cancelar, lo que significa que la aplicación insertada puede devolver {cancel: true} y Looker no continuará con el evento activador.

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 Cadena La etiqueta del botón.
url Cadena La URL relativa (solo la ruta) del Look que se va a ver.
dashboard.id Número o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
tile.id Entero El número de ID del evento, no de la baldosa.
tile.title Cadena El título de la baldosa, tal como se muestra en la parte superior de la baldosa.
tile.listen Objeto Los filtros del panel de control global que escucha este tile. Este objeto tiene el formato {"Filter Label": "Filter Field", ...}.

dashboard:tile:merge

Añadido el 25/14 Este evento se genera cuando el usuario hace clic en el botón Editar consulta combinada o en el elemento de menú Editar consulta combinada. El comportamiento predeterminado de este botón es abrir una nueva ventana de nivel superior que permita editar la consulta de combinación.

Este evento se puede cancelar, lo que significa que la aplicación insertada puede devolver {cancel: true} y Looker no continuará con el evento activador. Este evento permite que la aplicación insertada abra la edición de la consulta de combinación en un iframe en lugar de en una ventana de nivel superior. La aplicación de inserción no debe intentar cargar la URL en el iframe que ha activado el evento. En su lugar, se debe crear un nuevo iframe.

javascript type: dashboard:tile:merge, label: 'Edit Merged Query', dashboard_id: '13', dashboard_modified: false, tile_id: '218', tile_title: 'Untitled', url: '/embed/merge/edit?did=218&dbnx=1', absoluteUrl: 'https://.../embed/merge/edit?did=218&dbnx=1', target: '_blank',
Atributo Formato Descripción
label cadena La etiqueta del botón.
dashboard_id cadena El ID del panel de control al que pertenece el gráfico combinado de consulta.
dashboard_modified booleano Cuando true, este atributo indica que el panel de control se ha modificado. Si se continúa con la edición de la consulta de combinación, se pueden perder las actualizaciones del panel de control. La aplicación de inserción puede cancelar la edición de la consulta de combinación o advertir al usuario de que puede haber cambios sin guardar si continúa.
tile_id cadena ID del recuadro de consulta combinado.
tile_title cadena El título de la baldosa.
url cadena La URL de la consulta combinada. Este atributo se puede usar con el SDK de inserción para crear un nuevo iframe para la consulta combinada.
absoluteUrl cadena La URL completa de la consulta combinada. Este atributo se puede usar como src del elemento iframe. Se requerirán atributos adicionales.
target cadena El ID que se usará para el nombre de la ventana que se va a abrir.

dashboard:filters:changed

Este evento se crea cuando se aplican o se cambian los filtros de un panel de control.

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 o cadena El ID del panel de control.
dashboard.title Cadena El título, tal como se muestra en la parte superior del panel de control.
dashboard.canEdit Booleano Added 22.20 Cuando true, el usuario puede editar el panel de control.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta).
dashboard.absoluteUrl Cadena La URL completa del panel de control.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
dashboard.options Objeto Las propiedades y los valores de diseño del panel de control, componente de diseño del panel de control y elemento del panel de control. Todas las propiedades devueltas en el objeto options pueden recibir valores actualizados mediante el evento dashboard:options:set.

look:ready

Este evento se crea cuando un Look empieza a cargar datos de consulta, tanto si la consulta se ejecuta como si no.

type: "look:ready",
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Atributo Formato Descripción
look.url Cadena La URL de Look relativa (solo la ruta)
look.absoluteUrl Cadena La URL completa del Look

look:run:start

Este evento se crea cuando un Look empieza a cargar datos de consulta y la consulta empieza a ejecutarse.

type: "look:run:start",
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Atributo Formato Descripción
look.url Cadena La URL de Look relativa (solo la ruta)
look.absoluteUrl Cadena La URL completa del Look

look:run:complete

Este evento se crea cuando un Look ha terminado 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 Cadena La URL de Look relativa (solo la ruta)
look.absoluteUrl Cadena La URL completa del Look

look:edit:start

Añadido 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 Cadena El ID del aspecto.
look.title Cadena El título del Look.
url Cadena La URL relativa del Look (solo la ruta).
absoluteUrl Cadena La URL completa del Look.

look:edit:cancel

Añadido el 25/10 Este evento se activa cuando se sale del modo de edición de un Look sin guardar los cambios.

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 Cadena El ID del aspecto.
look.title Cadena El título del Look.
url Cadena La URL relativa del Look (solo la ruta).
absoluteUrl Cadena La URL completa del Look.

look:save:complete

Este evento se crea cuando se edita y se guarda un look. Este evento se crea cuando un usuario realiza una de las siguientes tareas:

Este evento no se crea si el Look se guarda con la opción de menú Guardar > En un panel de control ya creado 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 Cadena La URL de Look relativa (solo la ruta)
look.absoluteUrl Cadena La URL completa del Look
look.folderid Entero El ID de la carpeta en la que se almacena el Look

look:delete:complete

Este evento se crea cuando se mueve un look a la carpeta Papelera.

type: look:delete:complete
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Atributo Formato Descripción
look.url Cadena La URL de Look relativa (solo la ruta)
look.absoluteUrl Cadena La URL completa del Look

drillmenu:click

Este evento se crea cuando un usuario hace clic en un menú de desglose de un panel de control creado con el parámetro LookML link. Por ejemplo, el siguiente LookML crea un menú de desglose 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 define como 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: ' '

Este evento se puede cancelar, lo que significa que la aplicación insertada puede devolver {cancel: true} y Looker no continuará con el evento activador.

Atributo Formato Descripción
label Cadena La etiqueta del enlace tal como se muestra en el menú de desglose
link_type Cadena El tipo de objeto del destino del enlace
modal Booleano Indica si se usará el cuadro de diálogo de desglose en lugar de la navegación del navegador.
target Cadena Es _self si el destino del enlace sustituirá al iframe actual o _blank si el destino del enlace abrirá una ventana nueva.
url Cadena La URL del destino del enlace
context Cadena Atributo interno usado por algunos tipos de visualizaciones.

Incluir en un espacio aislado el iframe evitará que los clics en el menú de desglose se abran en una ventana nueva. Usa estos valores de aislamiento en el elemento iframe:

sandbox = "allow-same-origin allow-scripts"

drillmodal:download

Este evento se crea cuando un usuario abre un cuadro de diálogo de desglose desde una baldosa de un panel de control 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 o cadena El ID del panel de control al que pertenece la baldosa.
dashboard.title Cadena El título del panel de control, tal como se muestra en la parte superior del panel de control al que pertenece la baldosa.
dashboard.url Cadena La URL relativa del panel de control (solo la ruta) al que pertenece la baldosa.
dashboard.absoluteUrl Cadena La URL completa del panel de control al que pertenece la baldosa.
dashboard.dashboard_filters Objeto Los filtros aplicados al panel de control al que pertenece la baldosa. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.
drillExploreUrl Cadena La URL relativa de Explorar (solo la ruta) que se va a descargar.
fileFormat Cadena 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 cuadro de diálogo de desglose.

Este evento se puede cancelar, lo que significa que la aplicación insertada puede devolver {cancel: true} y Looker no continuará con el evento activador.

type: "drillmodal:explore",
label: "Explore From Here",
url: "/embed/explore/model/view..."
Atributo Formato Descripción
label Cadena La etiqueta del botón tal como se muestra en el menú de desglose
url Cadena La URL relativa de Exploración (solo la ruta) que se va a ver

explore:ready

Este evento se crea cuando una exploración empieza a cargar datos de consulta, tanto si la consulta se ejecuta como si no.

type: "explore:ready",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
  }
Atributo Formato Descripción
explore.url Cadena La URL de exploración relativa (solo la ruta)
explore.absoluteUrl Cadena La URL completa de Explorar

explore:run:start

Este evento se crea cuando un Exploración empieza a cargar datos de consulta y la consulta empieza a ejecutarse.

type: "explore:run:start",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
  }
Atributo Formato Descripción
explore.url Cadena La URL de exploración relativa (solo la ruta)
explore.absoluteUrl Cadena La URL completa de Explorar

explore:run:complete

Este evento se crea cuando un Exploración ha terminado 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 Cadena La URL de exploración relativa (solo la ruta)
explore.absoluteUrl Cadena La URL completa de Explorar

explore:state:changed

Este evento se crea cuando cambia la URL de una página 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 Cadena La URL de exploración relativa (solo la ruta)
explore.absoluteUrl Cadena La URL completa de Explorar

page:changed

Este evento se crea cuando un usuario se desplaza 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 Cadena El tipo de página a la que se acaba de acceder, como "dashboard", "look" o "explore"
page.url Cadena La URL relativa (solo la ruta) de la página a la que se acaba de acceder.
page.absoluteUrl Cadena La URL completa de la página a la que se acaba de acceder.

page:properties:changed

Este evento se crea cuando cambia la altura de un iframe de un panel de control. No está disponible en los looks ni en los desgloses porque estos elementos ajustan automáticamente su altura al tamaño del iframe.

type: "page:properties:changed",
height: 1000
Atributo Formato Descripción
height Entero Altura del iframe del panel de control en píxeles.

session:tokens

Este evento indica que el cliente de Looker necesita tokens para continuar. Este evento se crea inmediatamente al crear el iframe y, posteriormente, de forma periódica 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 Cadena Token de autenticación. Se incluye cuando se crea el iframe. No se incluye en la respuesta a una solicitud para generar tokens ni si la sesión ha caducado.
authentication_token_ttl Número Tiempo de vida del token de autenticación en segundos. Se incluye cuando se crea el iframe. No se incluye en la respuesta a una solicitud para generar tokens ni si la sesión ha caducado.
api_token Cadena Token de API. No se incluye si la sesión ha caducado.
api_token_ttl Número Tiempo de vida del token de API en segundos. No se incluye si la sesión ha caducado.
navigation_token Cadena Token de navegación. No se incluye si la sesión ha caducado.
navigation_token_ttl Número Tiempo de vida del token de navegación en segundos. No se incluye si la sesión ha caducado.
session_references_token_ttl Número Tiempo de vida de la sesión en segundos. El valor será 0 cuando la sesión haya caducado. Para recuperarse, la aplicación insertada debe adquirir una nueva sesión.

session:expired

Añadido el 25/10 Este evento se activa cuando caduca la sesión del usuario insertado.

type: "session:expired",

Este evento no tiene una carga útil.

session:status

El evento se genera cuando la aplicación de Looker insertada gestiona 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 Tiempo de vida de la sesión en segundos.
expired Booleano Cuando true, indica que la sesión ha caducado.
interrupted Booleano Cuando true, indica que no se ha respondido a una solicitud de tokens de sesión. Esto podría indicar que un servidor no está disponible temporalmente.
recoverable Booleano Solo se rellena si el valor de interrupted es true. Indica si la sesión se puede recuperar o no. Un valor de false probablemente significa que hay un problema con la aplicación insertada.

env:client:dialog

El evento se genera cuando se ha abierto un cuadro de diálogo que puede estar parcialmente fuera de la vista, como un cuadro de diálogo de desglose. Este evento permite que la aplicación de alojamiento desplace el cuadro de 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 Cadena env:client:dialog indica que se ha abierto o cerrado un cuadro de diálogo. Solo se admite el cuadro de diálogo de desglose, pero es posible que se añadan otros en el futuro. Es posible que la parte superior del cuadro de diálogo de desglose no se vea, ya que el cuadro de diálogo cubre el viewport del iframe. Este evento permite que la aplicación host desplace la parte superior del cuadro de diálogo para que se vea.
dialogType Cadena El tipo de cuadro de diálogo. Este evento solo se activa cuando se abre o se cierra el cuadro de diálogo de desglose.
placement Cadena La colocación del cuadro de diálogo. Los cuadros de diálogo de tipo "drilling" siempre usan un placement de "cover".
open Booleano Indica si el cuadro de diálogo se ha abierto o se ha desplazado.

Hacer cambios en el iframe

Una vez que haya preparado su iframe para recuperar datos, puede modificarlo siguiendo estos pasos:

  1. Escribe tu solicitud en JSON.
  2. Envía la solicitud al contentWindow del iframe.

Escribir la solicitud en JSON

Puedes hacer 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, como en este ejemplo:

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 esta forma:

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 los detalles correspondientes.

Acción Descripción de la acción
page:load Carga una página nueva en el iframe, que sustituye a la página actual.
dashboard:load Carga un nuevo panel de control en el iframe, que sustituye a otro.
dashboard:run Ejecuta el panel de control en el iframe.
dashboard:edit Añadido el 22.20 Cambia el panel de control al modo de edición.
dashboard:filters:update Actualiza un filtro de panel de control en el iframe.
dashboard:options:set Escribe nuevos valores en el diseño del panel de control y en las propiedades de los elementos del panel de control.
dashboard:schedule_modal:open Abre el programador, que permite a los usuarios enviar contenido de Looker a varios destinos.
dashboard:stop Detiene un panel de control que está ejecutando o recargando datos.
look:run Ejecuta la consulta en el iframe.
look:filters:update Actualiza un filtro de aspecto en el iframe.
explore:run Ejecuta Explorar en el iframe.
explore:filters:update Actualiza o elimina un filtro de Explorar 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 Looker insertada.

Referencia de acciones

Estas son las acciones disponibles que puedes publicar en el iframe insertado:

page:load

Usa esta acción para ir a contenido nuevo en el iframe, que sustituirá al contenido actual. 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.

Hay diferencias en el comportamiento que se deben tener en cuenta antes de usar page:load. dashboard:load impedirá que se produzca la navegación si se está editando el panel de control actual. page:load no impide que se produzca la navegación. La aplicación host puede determinar si se está editando un panel de control o un look monitorizando 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 inserción. El SDK de inserción monitoriza si se está editando un panel de control o un 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 Cadena Si usas el tipo page:load, se indica que quieres cargar contenido nuevo en el iframe.
url Cadena La URL del contenido que se va a cargar.
pushHistory Booleano Si true, el contenido cargado crea una nueva entrada en el historial del navegador y el usuario puede usar el botón para volver del navegador para volver al contenido anterior. Si false, el contenido actual se sustituye y no se puede usar la navegación del navegador para volver a él.

dashboard:load

Usa esta acción para cargar un nuevo panel de control en el iframe, que sustituirá al panel de control actual. El nuevo panel de control empezará a ejecutar consultas como si se hubiera abierto una nueva página del panel de control.

{
  type: "dashboard:load",
  id: "101",
  pushHistory: false
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:load, se cargará un nuevo panel de control en el iframe.
id Cadena ID del panel de control que se va a cargar.
pushHistory Booleano Si true, el panel de control que se carga crea una nueva entrada en el historial del navegador y el usuario puede usar el botón para volver del navegador para volver al panel de control anterior. Si false, el panel de control actual se sustituye y no se puede usar la navegación del navegador para volver a él.

dashboard:run

Usa esta acción para ejecutar el panel de control en el iframe. Es la misma acción que pulsar el botón Ejecutar o Volver a cargar datos del panel de control.

{
  type: "dashboard:run"
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:run, significa que quieres ejecutar el panel de control.

dashboard:edit

Añadido el 22/20 Usa esta acción para cambiar un panel de control que ya tengas en el iframe al modo de edición. Es lo mismo que seleccionar Editar panel de control en el menú del panel de control.

{
  type: "dashboard:edit"
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:edit, se indica que quieres cambiar el panel de control al modo de edición.

dashboard:filters:update

Usa esta acción para actualizar un filtro de panel de control en el iframe. No puedes añadir un filtro al panel de control con este método.

{
  type: "dashboard:filters:update",
  filters: {
    "Sale date": "Last 28 days",
    "Sale amount": "Greater than 100"
  }
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:filters:update, significa que quieres actualizar los filtros que usa el panel de control.
filters Objeto Los nuevos filtros que quieras aplicar al panel de control. Este objeto tiene el formato {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}.

dashboard:options:set

Esta acción está disponible después de que se produzca el evento dashboard:run:complete.

El insertador crea el mensaje y lo envía al iframe, pero el panel de control no responde hasta que se produce dashboard:run:complete. La acción dashboard:options:set escribe nuevos valores en el diseño del panel de control y en las propiedades de los elementos del panel de control. Solo se pueden actualizar con dashboard:options:set las propiedades que se hayan devuelto en el atributo options del evento dashboard:run:complete. Se ignorarán las propiedades definidas que no haya devuelto 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 Cadena Si usa el tipo dashboard:options:set, indica que quiere escribir nuevos valores en las propiedades de diseño y de elemento del panel de control.
layouts Objeto Las propiedades del diseño del panel de control devueltas por el atributo options en el evento dashboard:run:complete. Tendrán un formato similar al siguiente:

  • id: "string",
  • dashboard_id: "string",
  • type: "newspaper",
  • active: boolean,
  • column_width: number,
  • width: number
layouts.dashboard_layout_components Objeto Uno o varios objetos componentes de diseño del panel de control devueltos por el atributo options en el evento dashboard:run:complete. Tendrán un formato similar al siguiente:

  • id: "string",
  • dashboard_layout_id: "string",
  • dashboard_element_id: "string",
  • row: number,
  • column: number,
  • width: number,
  • height: number,
  • deleted: boolean,
elements Objeto Uno o varios objetos dashboard element devueltos por 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 enviar contenido de Looker a varios destinos.

{
  type: "dashboard:schedule_modal:open"
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:schedule_modal:open, se abrirá el cuadro de diálogo Programar.

dashboard:stop

Usa esta acción para detener un panel de control que esté ejecutándose o recargando datos. Es lo mismo que hacer clic en el botón Cancelar del panel de control. Un panel de control que se detiene mediante dashboard:stop envía un evento dashboard:run:complete con status: definido como "stopped".

{
  type: "dashboard:stop"
}
Atributo Formato Descripción
type Cadena Si usas el tipo dashboard:stop, se detendrá el panel de control 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 pulsar el botón Ejecutar de un Look, con la diferencia de que look:run siempre consulta la base de datos directamente y no obtiene datos de la caché de Looker.

{
  type: "look:run"
}
Atributo Formato Descripción
type Cadena Si usas el tipo look:run, significa que quieres ejecutar el Look.

look:filters:update

Usa esta acción para actualizar un filtro de Look en el iframe. No puedes añadir un filtro nuevo al Look con este método.

{
  type: "look:filters:update",
  filters: {
    "orders.created_at": "90 days",
    "products.department": "sweaters"
  }
}
Atributo Formato Descripción
type Cadena Si usas el tipo look:filters:update, significa que quieres actualizar los filtros que usa el look.
filters Objeto Los nuevos filtros que quieras aplicar al aspecto. Este objeto tiene el formato {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...}.

explore:run

Usa esta acción para ejecutar Explorar en el iframe. Esta acción es similar a pulsar el botón Ejecutar en Explorar, con la excepción de que explore:run siempre consulta la base de datos directamente y no obtiene datos de la caché de Looker.

{
  type: "explore:run"
}
Atributo Formato Descripción
type Cadena Si usas el tipo explore:run, significa que quieres ejecutar la exploración.

explore:filters:update

Usa esta acción para actualizar o quitar un filtro de Explorar en el iframe. Si incluye un filtro que haga referencia a un campo válido, se añadirá a la exploración.

{
  type: "explore:filters:update",
  filters: {
    "orders.created_at": "90 days",
    "orders.status": "complete"
  }
  deleteFilters:  ["products.department"]
}
Atributo Formato Descripción
type Cadena Si usas el tipo explore:filters:update, significa que quieres actualizar los filtros que usa Exploración.
filters Objeto Los nuevos filtros que quieras aplicar a la pestaña Explorar. Si filters incluye un filtro que no existe en Exploración, pero que hace referencia a un campo válido, ese filtro se añadirá a Exploración. Este objeto tiene el formato {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...}.
deleteFilters Matriz Los filtros que quieras quitar de la exploración. La matriz tiene el 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 session:tokens:request.

{
  type: "session:tokens:request",
}
Atributo Formato Descripción
type Cadena Si usa el tipo session:tokens:request, indica que quiere 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 insertada.

{
  type: "env:host:scroll",
  offsetTop: 10,
  offsetLeft: 10,
  scrollX: 5,
  scrollY: 5
}
Atributo Formato Descripción
type Cadena Si usas el tipo env:host:scroll, significa que quieres enviar información sobre la posición de desplazamiento actual del iframe de alojamiento a la aplicación de Looker insertada.
offsetTop Número La parte superior de la compensación del iframe.
offsetLeft Número 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 desplazamiento vertical del host de la aplicación.