Extensiones de mosaicos de compilación

A partir de Looker 24.0, las extensiones se pueden desarrollar para ejecutarse en un mosaico en los paneles. Las extensiones que se pueden ejecutar como mosaico o visualización se pueden agregar mientras el panel está en modo de edición o guardarse en un panel como una visualización de una exploración. Las extensiones también se pueden configurar como mosaicos en los paneles de LookML.

Estos son algunos ejemplos de extensiones que se pueden usar como mosaicos de panel:

• En la extensión de visualización de tarjetas, se muestra cómo crear una visualización personalizada con el framework de extensiones.
• La extensión del SDK de tarjetas muestra los métodos de API disponibles que son específicos para las extensiones de tarjetas.

Usa el SDK de la extensión de Looker con extensiones de mosaicos

Las extensiones de mosaicos requieren que se defina el parámetro mount_points en el archivo de manifiesto del proyecto de LookML para que las extensiones se carguen como tarjetas en un panel. Existen dos tipos de mount_points relacionados con las extensiones de tarjetas:

  mount_points: {
    dashboard_vis: yes
    dashboard_tile: yes
    standalone: yes
  }

• dashboard_vis: Cuando se habilite, la extensión aparecerá en las opciones de visualización de una exploración, donde se puede seleccionar como visualización y guardar como un mosaico del panel. Cuando se ejecute el panel, este ejecutará la consulta asociada con el mosaico y pondrá los datos a disposición de la extensión. Esto es similar a cómo funcionan las visualizaciones personalizadas. La diferencia principal entre una visualización personalizada y una extensión que se ejecuta en un mosaico del panel que tiene dashboard_vis habilitado es que la extensión puede realizar llamadas a la API de Looker.
• dashboard_tile: Si se habilita, la extensión aparecerá en el panel Extensiones que se muestra cuando un usuario edita un panel y selecciona la opción Extensiones después de hacer clic en el botón Agregar. Este tipo de extensión se encarga de recuperar sus propios datos, en lugar de hacer que la consulta de mosaicos le proporcione datos automáticamente a la extensión.

Un punto de activación adicional, standalone, hace que la extensión aparezca en la sección Applications del menú principal de Looker. Es posible que una extensión tenga varios puntos de activación definidos. Durante el tiempo de ejecución, la extensión recibe una notificación sobre cómo se activa y puede ajustar su comportamiento según corresponda. Por ejemplo, es posible que las extensiones de standalone deban establecer su propia altura, mientras que las extensiones de mosaicos no.

APIs adicionales de extensión de tarjetas

Las extensiones de tarjetas se proporcionan con APIs y datos adicionales en el tiempo de ejecución. Estos se obtienen del contexto de la extensión:

const {
  tileSDK,
  tileHostData,
  visualizationData,
  visualizationSDK,
} = useContext(ExtensionContext40)

• tileSDK: Proporciona funciones específicas de tarjetas para permitir que la extensión interactúe con el host del panel de Looker. Por ejemplo, para permitir que la extensión muestre y borre mensajes de error.
• tileHostData: Proporciona datos de tarjetas a la extensión. Los datos se actualizan automáticamente en función de las interacciones con el panel de hosting. Un ejemplo es el indicador isDashboardEditing.
• visualizationSDK: Proporciona funciones específicas de visualización para permitir que la extensión interactúe con el host del panel de Looker. Un ejemplo es la función updateRowLimit.
• visualizationData: Proporciona datos de visualización a la extensión. Los datos se actualizan automáticamente en función de las interacciones con el panel de hosting. Los datos son similares a los que se proporcionan para las visualizaciones personalizadas.

Cómo compilar extensiones reactivas

Los iframes en los que se ejecutan las extensiones cambian de tamaño automáticamente a medida que cambia el tamaño de la ventana superior del host de Looker. Esto se refleja automáticamente en la ventana de contenido del iframe. El componente de iframe no tiene padding ni margen, por lo que depende de la extensión proporcionar su propio padding y margen para que se vea coherente con la aplicación de Looker. En el caso de las extensiones independientes, depende de la extensión controlar la altura de la extensión. En el caso de las extensiones que se ejecutan en mosaicos del panel o en las visualizaciones de Explorar, la ventana de contenido del iframe se establecerá automáticamente a la altura que esté disponible en el iframe.

Consideraciones sobre la renderización

Es importante tener en cuenta que las extensiones de mosaicos se renderizarán cuando se descargue un panel como PDF o una imagen. El renderizador espera que la tarjeta le notifique cuando se complete la renderización. Si no se hace esto, el renderizador dejará de responder. El siguiente es un ejemplo de cómo notificar al renderizador que se renderizó la tarjeta.

  const { extensionSDK } = useContext(ExtensionContext40)

  useEffect(() => {
    extensionSDK.rendered()
  }, [])

Las animaciones también deben inhabilitarse durante la renderización. El siguiente es un ejemplo en el que se desactivan las configuraciones de animación durante la renderización:

  const { lookerHostData} = useContext(ExtensionContext40)
  const isRendering = lookerHostData?.isRendering

  const config = isRendering
    ? {
        ...visConfig,
        valueCountUp: false,
        waveAnimateTime: 0,
        waveRiseTime: 0,
        waveAnimate: false,
        waveRise: false,
      }
    : visConfig

  if (mountPoint === MountPoint.dashboardVisualization) {
    return <VisualizationTile config={config} />
  }

Funciones y propiedades del SDK de tarjetas

El SDK de tarjetas proporciona funciones que permiten que una extensión de tarjeta interactúe con su panel de hosting.

En la siguiente tabla, se muestran las funciones y propiedades disponibles:

Datos del SDK de tarjetas

En la siguiente tabla, se muestran las propiedades de datos del SDK de mosaicos disponibles:

Funciones y propiedades del SDK de visualización

En la siguiente tabla, se muestran las funciones y propiedades disponibles del SDK de visualización:

Datos del SDK de visualización

El SDK de visualización consta de lo siguiente:

• Datos de configuración de la visualización
• Cómo consultar datos de respuesta

Datos de configuración de la visualización

export interface VisualizationConfig {
  queryFieldMeasures: Measure[]
  queryFieldDimensions: Dimension[]
  queryFieldTableCalculations: TableCalculation[]
  queryFieldPivots: PivotConfig[]
  visConfig: RawVisConfig
}

Datos de respuesta de la consulta