Eventi JavaScript incorporati

Dopo aver creato un elemento incorporato, che può essere eseguito pubblicamente, privatamente, con l'incorporamento firmato o tramite l'API, puoi interagire con questi iframe utilizzando JavaScript. Puoi rendere la tua pagina più dinamica in base allo stato dell'elemento incorporato e puoi persino apportare modifiche all'elemento incorporato dalla tua pagina web.

È importante sapere che Looker non controlla l'ordine in cui i browser inviano gli eventi alle applicazioni web. Ciò significa che l'ordine degli eventi non è garantito per tutti i browser o le piattaforme. Verifica di scrivere il JavaScript in modo da tenere conto della gestione degli eventi dei diversi browser.

Puoi utilizzare JavaScript in uno dei seguenti modi per i contenuti incorporati di Looker:

  • Utilizzando il software development kit (SDK) di incorporamento di Looker, descritto nella pagina della documentazione SDK Embed
  • Utilizzando gli eventi JavaScript, descritti nella sezione Accesso agli eventi in JavaScript di questa pagina.

preparazione

Prima di poter interagire con l'iframe incorporato, segui questi passaggi:

Aggiunta di un ID all'iframe

In seguito, quando recuperi i dati dall'iframe, dovrai verificare che le informazioni con cui stai lavorando provengano effettivamente dall'iframe di Looker. Per facilitare questa operazione, assicurati di aggiungere un ID all'iframe, se non l'hai già fatto. Nell'esempio seguente, imposti l'ID su looker aggiungendo id="looker" all'iframe:

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

Aggiunta del dominio di incorporamento all'attributo src dell'iframe

Nell'attributo src dell'iframe, includi il dominio in cui viene utilizzato l'iframe. Nell'esempio seguente, puoi specificare myownpersonaldomain.com come dominio aggiungendo ?embed_domain=https://myownpersonaldomain.com" alla fine dell'URL nell'attributo src:

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

Se utilizzi l'incorporamento firmato, assicurati di aggiungere embed_domain all'URL di incorporamento.

Se utilizzi l'SDK Embed, aggiungi sdk=3 alla fine dell'URL di incorporamento. Il parametro sdk=3 indica che l'SDK è presente e che Looker può sfruttare le funzionalità aggiuntive fornite dall'SDK, come il passaggio di eventi JavaScript tra l'iframe di Looker e il tuo dominio. L'SDK non può aggiungere questo parametro autonomamente perché fa parte dell'URL firmato. Ad esempio:

<iframe
  id="looker"
  src="https://instance_name.looker.com/embed/dashboards/1?embed_domain=https://myownpersonaldomain.com&sdk=2">
</iframe>

Aggiunta del dominio di incorporamento alla lista consentita

Infine, dovrai aggiungere il dominio in cui viene utilizzato l'iframe alla lista consentita nella pagina Incorpora del pannello Amministratore di Looker seguendo questi passaggi:

  1. Nel campo Lista consentita dei domini incorporati, inserisci il dominio in cui viene utilizzato l'iframe, quindi premi il tasto Tab in modo che il dominio venga visualizzato in una casella all'interno del campo.

  2. Fai clic su Aggiorna.

Puoi utilizzare il carattere jolly * nella lista consentita per creare un pattern di dominio. Ad esempio, https://*.myownpersonaldomain.com consentirebbe sia https://analytics.myownpersonaldomain.com che https://data.myownpersonaldomain.com.

Se utilizzi l'incorporamento senza cookie con Looker 23.8 o versioni successive, il dominio di incorporamento può essere specificato quando viene acquisita la sessione senza cookie. Questa è un'alternativa all'aggiunta del dominio di incorporamento alla lista consentita utilizzando il riquadro Amministrazione > Incorpora. Se decidi di utilizzare questa funzionalità, consulta le best practice per la sicurezza.

Recupero dei dati dall'iframe

Dopo aver completato i passaggi di preparazione, puoi accedere agli eventi che vengono passati tra l'iframe di Looker e il tuo dominio ascoltando gli eventi postMessage.

L'iframe incorporato può creare alcuni tipi di eventi, come descritto nella sezione Riferimento ai tipi di eventi di questa pagina.

Accesso agli eventi in JavaScript

Ecco un esempio di ascolto di questi eventi in JavaScript e di registrazione degli eventi nella console:

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));
    }
  }
});

Ecco un esempio di ascolto di questi eventi in jQuery, seguito dalla loro registrazione nella console:

$(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));
    }
  }
});

Tabella di riepilogo dei tipi di eventi

La tabella seguente riassume i tipi di eventi. Seleziona un tipo di evento per visualizzarne i dettagli.

Tipo di evento Causa dell'evento
dashboard:loaded Nelle dashboard in cui i riquadri non sono impostati per l'esecuzione automatica, la dashboard e i relativi elementi sono stati caricati, ma le query non sono ancora in esecuzione.
dashboard:run:start È iniziato il caricamento di una dashboard e i relativi riquadri hanno iniziato a caricare ed eseguire query sui dati.
dashboard:run:complete L'esecuzione di una dashboard è stata completata e tutti i riquadri hanno terminato il caricamento e l'esecuzione delle query.
dashboard:download È iniziato il download di un PDF di una dashboard.
dashboard:edit:start Aggiunta 22.20 Una dashboard è stata impostata sulla modalità di modifica. L'evento dashboard:save:complete verrà attivato quando la dashboard viene salvata correttamente.
dashboard:edit:cancel Aggiunta 22.20 È stata chiusa una dashboard in modalità di modifica senza salvare.
dashboard:save:complete Una dashboard è stata modificata e salvata.
dashboard:delete:complete Una dashboard è stata eliminata.
dashboard:tile:start Un riquadro ha iniziato a caricare o eseguire query sui dati.
dashboard:tile:complete Un riquadro ha terminato l'esecuzione della query.
dashboard:tile:download È iniziato il download dei dati di un riquadro.
dashboard:tile:explore Un utente ha fatto clic sull'opzione Esplora da qui in un riquadro della dashboard.
dashboard:tile:merge Aggiunta 25.14 Un utente ha fatto clic sul pulsante o sulla voce di menu Modifica query unita.
dashboard:tile:view Un utente ha fatto clic sull'opzione Visualizza Look originale nel riquadro di una dashboard.
dashboard:filters:changed I filtri di una dashboard sono stati applicati o modificati.
look:ready Un look ha iniziato a caricare i dati della query, indipendentemente dal fatto che la query venga eseguita o meno.
look:run:start Un Look ha iniziato a caricare i dati della query e la query ha iniziato a essere eseguita.
look:run:complete Un Look ha terminato l'esecuzione della query.
look:edit:start Aggiunta 25.10 Un Look è stato impostato sulla modalità di modifica. L'evento look:save:complete verrà attivato quando il look viene salvato.
look:edit:cancel Aggiunta 25.10 È stata eseguita l'uscita dalla modalità di modifica di un Look senza salvare.
look:save:complete Un look è stato modificato e salvato.
look:delete:complete Un Look è stato spostato nella cartella Cestino.
drillmenu:click Un utente ha fatto clic su un menu di drill-down in una dashboard creata con il parametro LookML link.
drillmodal:download Un utente ha aperto una finestra di dialogo di visualizzazione in dettaglio da un riquadro della dashboard e ha fatto clic sull'opzione Scarica.
drillmodal:explore Un utente ha fatto clic sull'opzione Esplora da qui in una finestra di dialogo di esplorazione.
explore:ready Un'esplorazione ha iniziato a caricare i dati della query, indipendentemente dal fatto che la query venga eseguita o meno.
explore:run:start Un'esplorazione ha iniziato a caricare i dati della query e la query ha iniziato a essere eseguita.
explore:run:complete Un'esplorazione ha terminato l'esecuzione della query.
explore:state:changed L'URL di una pagina Esplora è stato modificato in seguito alle azioni dell'utente.
merge:ready Una query di unione ha terminato il caricamento dei dati della query iniziale.
merge:run:start È stata avviata l'esecuzione di una query di unione.
merge:run:complete Una query di unione ha terminato l'esecuzione della query.
merge:run:fail Una query di unione non è stata eseguita e ha restituito un errore.
page:changed Un utente ha visitato una nuova pagina all'interno dell'iframe.
page:properties:changed L'altezza di un iframe della dashboard è cambiata.
session:tokens Il client Looker richiede i token per continuare.
session:expired Aggiunta 25.10 La sessione dell'utente è scaduta.
session:status Invia informazioni sullo stato di una sessione.
env:client:dialog È stata aperta una finestra di dialogo che potrebbe essere parzialmente fuori campo, ad esempio una finestra di dialogo di visualizzazione in dettaglio. Questo evento consente all'applicazione in hosting di scorrere la finestra di dialogo per visualizzarla.

Riferimento per il tipo di evento

L'iframe incorporato può creare molti tipi di eventi diversi:

dashboard:loaded

Nelle dashboard in cui i riquadri non sono impostati per l'esecuzione automatica, questo evento viene creato dopo il caricamento di una dashboard e dei relativi elementi, ma prima dell'esecuzione delle query.


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"
        }
      }
    }
  }
}
Attributo Formato Descrizione
status Stringa Indica se la dashboard e i relativi elementi sono stati caricati correttamente.
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.options Oggetto Le proprietà e i valori di layout della dashboard, componente del layout della dashboard ed elemento della dashboard. A tutte le proprietà restituite nell'oggetto options possono essere assegnati valori aggiornati utilizzando l'evento dashboard:options:set.

dashboard:run:start

Questo evento viene creato quando una dashboard ha iniziato a caricarsi, quando i suoi riquadri inizieranno a caricarsi e a eseguire query sui dati.

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"
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}

dashboard:run:complete

Questo evento viene creato quando una dashboard ha terminato l'esecuzione e tutti i riquadri hanno terminato il caricamento e l'esecuzione delle query. Questo evento viene creato indipendentemente dal fatto che tutti i riquadri vengano caricati correttamente o meno.

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"
        }
      }
    }
  }
}
Attributo Formato Descrizione
status Stringa Indica se la dashboard e i relativi elementi sono stati eseguiti correttamente. Se la dashboard e i suoi elementi sono stati eseguiti correttamente, status restituisce "complete"; in caso contrario, status restituisce "error". Se la dashboard in esecuzione è stata arrestata, dall'interfaccia utente o con l'azione dashboard:stop, status restituirà "stopped".
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
dashboard.options Oggetto Le proprietà e i valori di layout della dashboard, componente del layout della dashboard ed elemento della dashboard. A tutte le proprietà restituite nell'oggetto options è possibile assegnare valori aggiornati utilizzando l'azione dashboard:options:set.
dashboard.tileStatuses Array di oggetti Un array di oggetti che forniscono gli stati dei riquadri. Le proprietà degli oggetti sono:

  • tileId: il numero ID del riquadro.
  • status: se la query del riquadro è stata eseguita correttamente, status restituisce "complete"; in caso contrario, status restituisce "error".
  • errors: viene compilato quando la proprietà status è "error". Un array di oggetti che forniscono i dettagli dell'errore, tra cui il testo del messaggio di errore, una descrizione più dettagliata dell'errore e la query SQL del riquadro che ha generato l'errore.

dashboard:download

Questo evento viene creato quando inizia il download di un PDF di una dashboard.

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"
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
fileFormat Stringa Il formato della dashboard scaricata (al momento solo "pdf").

dashboard:edit:start

Aggiunta 22.20 Questo evento viene creato quando una dashboard viene passata alla modalità di modifica.

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"
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}

dashboard:edit:cancel

Aggiunta 22.20 Questo evento viene creato quando si esce dalla modalità di modifica di una dashboard senza salvare.

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"
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}

dashboard:save:complete

Questo evento viene creato quando una dashboard viene modificata e poi salvata.

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"
        }
      }
    }
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.options Oggetto Le proprietà e i valori di layout della dashboard, componente del layout della dashboard ed elemento della dashboard. A tutte le proprietà restituite nell'oggetto options possono essere assegnati valori aggiornati utilizzando l'evento dashboard:options:set.

dashboard:delete:complete

Questo evento viene creato quando una dashboard viene eliminata.

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"
        }
      }
    }
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.options Oggetto Le proprietà e i valori di layout della dashboard, componente del layout della dashboard ed elemento della dashboard. A tutte le proprietà restituite nell'oggetto options possono essere assegnati valori aggiornati utilizzando l'evento dashboard:options:set.

dashboard:tile:start

Questo evento viene creato quando un riquadro inizia a caricare o eseguire query sui dati.

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"
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
tile.id Numero intero Il numero ID dell'evento, non del riquadro.
tile.title Stringa Il titolo del riquadro, come mostrato nella parte superiore del riquadro.
tile.listen Oggetto I filtri della dashboard globale che questo riquadro sta ascoltando. Questo oggetto ha il formato: {"Filter Label": "Filter Field", ...}

dashboard:tile:complete

Questo evento viene creato quando un riquadro ha terminato l'esecuzione della query.

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"
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
status Stringa Indica se la query del riquadro è stata completata correttamente. I valori possibili sono "complete" o "error".
truncated Booleano Indica se i risultati della query del riquadro sono stati troncati perché la query ha restituito un numero di righe superiore al limite di righe della query. Il limite di righe potrebbe essere un limite di righe specificato dall'utente o il limite di righe predefinito di Looker di 5000.
tile.id Numero intero Il numero ID dell'evento, non del riquadro.
tile.title Stringa Il titolo del riquadro, come mostrato nella parte superiore del riquadro.
tile.listen Oggetto I filtri della dashboard globale che questo riquadro sta ascoltando. Questo oggetto ha il formato: {"Filter Label": "Filter Field", ...}
tile.errors Array di oggetti Compilato quando la proprietà status è "error". Un array di oggetti che forniscono i dettagli dell'errore, tra cui il testo del messaggio di errore, una descrizione più dettagliata dell'errore e la query SQL del riquadro che ha generato l'errore.

dashboard:tile:download

Questo evento viene creato quando inizia il download dei dati di un riquadro.

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"
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
tile.id Numero intero Il numero ID dell'evento, non del riquadro.
tile.title Stringa Il titolo del riquadro, come mostrato nella parte superiore del riquadro.
tile.listen Oggetto I filtri della dashboard globale che questo riquadro sta ascoltando. Questo oggetto ha il formato: {"Filter Label": "Filter Field", ...}
fileFormat Stringa Il formato della sezione scaricata (al momento solo "pdf").

dashboard:tile:explore

Questo evento viene creato quando un utente fa clic sull'opzione Esplora da qui in un riquadro della dashboard.

Questo evento è annullabile, il che significa che l'applicazione di incorporamento può restituire {cancel: true} e Looker non procederà con l'evento di attivazione.

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"
  }
}
Attributo Formato Descrizione
label Stringa L'etichetta del pulsante.
url Stringa L'URL relativo (solo il percorso) dell'esplorazione da visualizzare.
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
tile.id Numero intero Il numero ID dell'evento, non del riquadro.
tile.title Stringa Il titolo del riquadro, come mostrato nella parte superiore del riquadro.
tile.listen Oggetto I filtri della dashboard globale che questo riquadro sta ascoltando. Questo oggetto ha il formato: {"Filter Label": "Filter Field", ...}

dashboard:tile:view

Questo evento viene creato quando un utente fa clic sull'opzione Visualizza Look originale in un riquadro della dashboard.

Questo evento è annullabile, il che significa che l'applicazione di incorporamento può restituire {cancel: true} e Looker non procederà con l'evento di attivazione.

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"
  }
}
Attributo Formato Descrizione
label Stringa L'etichetta del pulsante.
url Stringa L'URL relativo (solo il percorso) del Look da visualizzare.
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
tile.id Numero intero Il numero ID dell'evento, non del riquadro.
tile.title Stringa Il titolo del riquadro, come mostrato nella parte superiore del riquadro.
tile.listen Oggetto I filtri della dashboard globale che questo riquadro sta ascoltando. Questo oggetto ha il formato: {"Filter Label": "Filter Field", ...}

dashboard:tile:merge

Aggiunta 25.14 Questo evento viene generato quando l'utente fa clic sul pulsante Modifica query unita o sulla voce di menu Modifica query unita. Il comportamento predefinito di questo pulsante è aprire una nuova finestra di primo livello che consente di modificare la query di unione.

Questo evento è annullabile, il che significa che l'applicazione di incorporamento può restituire {cancel: true} e Looker non procederà con l'evento di attivazione. Questo evento consente all'applicazione di incorporamento di aprire l'editor di query di unione in un iframe anziché in una finestra di primo livello. L'applicazione di incorporamento non deve tentare di caricare l'URL nell'iframe che ha attivato l'evento. È invece necessario creare un nuovo 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',
Attributo Formato Descrizione
label string L'etichetta del pulsante.
dashboard_id string L'ID della dashboard a cui appartiene il riquadro della query unita.
dashboard_modified boolean Se true, questo attributo indica che la dashboard è stata modificata. Gli aggiornamenti alla dashboard possono andare persi se si procede con la modifica nell'editor di query di unione. L'applicazione di incorporamento può annullare la modifica dell'editor di query di unione o avvisare l'utente che potrebbe avere modifiche non salvate se procede.
tile_id string L'ID del riquadro della query unita.
tile_title string Il titolo del riquadro.
url string L'URL della query unita. Questo attributo può essere utilizzato con l'SDK incorporato per creare un nuovo iframe per la query unita.
absoluteUrl string L'URL completo della query unita. Questo attributo può essere utilizzato come src dell'elemento iframe. Saranno richiesti attributi aggiuntivi.
target string L'ID da utilizzare per il nome della finestra da aprire.

dashboard:filters:changed

Questo evento viene creato quando i filtri di una dashboard vengono applicati o modificati.

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"
        }
      }
    }
  }
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard.
dashboard.title Stringa Il titolo, come mostrato nella parte superiore della dashboard.
dashboard.canEdit Booleano Aggiunta 22.20 Quando true, l'utente può modificare la dashboard.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso).
dashboard.absoluteUrl Stringa L'URL completo della dashboard.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
dashboard.options Oggetto Le proprietà e i valori di layout della dashboard, componente del layout della dashboard ed elemento della dashboard. A tutte le proprietà restituite nell'oggetto options possono essere assegnati valori aggiornati utilizzando l'evento dashboard:options:set.

look:ready

Questo evento viene creato quando un Look inizia a caricare i dati della query, indipendentemente dal fatto che la query venga eseguita o meno.

type: "look:ready",
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Attributo Formato Descrizione
look.url Stringa L'URL relativo del Look (solo il percorso)
look.absoluteUrl Stringa L'URL completo del Look

look:run:start

Questo evento viene creato quando un Look inizia a caricare i dati della query e la query inizia a essere eseguita.

type: "look:run:start",
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Attributo Formato Descrizione
look.url Stringa L'URL relativo del Look (solo il percorso)
look.absoluteUrl Stringa L'URL completo del Look

look:run:complete

Questo evento viene creato quando un Look ha terminato l'esecuzione della query.

type: look:run:complete
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Attributo Formato Descrizione
look.url Stringa L'URL relativo del Look (solo il percorso)
look.absoluteUrl Stringa L'URL completo del Look

look:edit:start

Aggiunta 25.10 Questo evento viene attivato quando un Look viene impostato in modalità di modifica.

type: "look:edit:start",
look: {
  id: 46,
  title: "My Look",
  url: "/embed/looks/46",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/46",
}
Attributo Formato Descrizione
look.id Stringa L'ID del Look.
look.title Stringa Il titolo del Look.
url Stringa L'URL relativo del Look (solo il percorso).
absoluteUrl Stringa L'URL completo del Look.

look:edit:cancel

Aggiunto 25.10 Questo evento viene attivato quando si esce dalla modalità di modifica di un Look senza salvare.

type: "look:edit:cancel",
look: {
  id: 46,
  title: "My Look",
  url: "/embed/looks/46",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/46",
}
Attributo Formato Descrizione
look.id Stringa L'ID del Look.
look.title Stringa Il titolo del Look.
url Stringa L'URL relativo del Look (solo il percorso).
absoluteUrl Stringa L'URL completo del Look.

look:save:complete

Questo evento viene creato quando un Look viene modificato e salvato. Questo evento viene creato quando un utente esegue una delle seguenti attività:

Questo evento non viene creato se il Look viene salvato con l'opzione di menu Salva > In una dashboard esistente o Modifica impostazioni.

type: look:save:complete
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  folderid: 123
  }
Attributo Formato Descrizione
look.url Stringa L'URL relativo del Look (solo il percorso)
look.absoluteUrl Stringa L'URL completo del Look
look.folderid Numero intero L'ID della cartella in cui è archiviato il Look

look:delete:complete

Questo evento viene creato quando un Look viene spostato nella cartella Cestino.

type: look:delete:complete
look: {
  url: "/embed/looks/...",
  absoluteUrl: "https://instance_name.looker.com/embed/looks/...",
  }
Attributo Formato Descrizione
look.url Stringa L'URL relativo del Look (solo il percorso)
look.absoluteUrl Stringa L'URL completo del Look

drillmenu:click

Questo evento viene creato quando un utente fa clic su un menu di drill-down in una dashboard creata con il parametro LookML link. Ad esempio, il seguente LookML crea un menu di drill-down in cui un utente può visualizzare i dati filtrati in base alla dimensione 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"
  }
}

Quando il filtro state è impostato su Illinois, l'evento drillmenu:click restituisce quanto segue all'host dell'iframe:

type: "drillmenu:click",
label: "Filter by Illinois",
link_type: "url",
modal: false,
target: '_self',
url: "#filter::state=Illinois"
context: ' '

Questo evento è annullabile, il che significa che l'applicazione di incorporamento può restituire {cancel: true} e Looker non procederà con l'evento di attivazione.

Attributo Formato Descrizione
label Stringa L'etichetta del link visualizzata nel menu di visualizzazione in dettaglio
link_type Stringa Il tipo di oggetto nella destinazione del link
modal Booleano Indica se verrà utilizzata la finestra di dialogo di visualizzazione dettagliata anziché la navigazione del browser
target Stringa _self se la destinazione del link sostituirà l'iframe corrente, _blank se la destinazione del link aprirà una nuova finestra
url Stringa L'URL della destinazione del link
context Stringa Attributo interno utilizzato da alcuni tipi di visualizzazioni

Il sandboxing dell'iframe impedirà l'apertura dei clic sul menu di visualizzazione in dettaglio in una nuova finestra. Utilizza questi valori di sandboxing all'interno del tag iframe:

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

drillmodal:download

Questo evento viene creato quando un utente apre una finestra di dialogo di visualizzazione dettagliata da un riquadro della dashboard e fa clic sull'opzione Scarica.

{
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"
}
Attributo Formato Descrizione
dashboard.id Numero/stringa L'ID della dashboard a cui appartiene il riquadro.
dashboard.title Stringa Il titolo della dashboard, come mostrato nella parte superiore della dashboard a cui appartiene il riquadro.
dashboard.url Stringa L'URL relativo della dashboard (solo il percorso) a cui appartiene il riquadro.
dashboard.absoluteUrl Stringa L'URL completo della dashboard a cui appartiene il riquadro.
dashboard.dashboard_filters Oggetto I filtri applicati alla dashboard a cui appartiene il riquadro. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}
drillExploreUrl Stringa L'URL di esplorazione relativo (solo il percorso) da scaricare.
fileFormat Stringa Il formato file del download dei dati.

drillmodal:explore

Questo evento viene creato quando un utente fa clic sull'opzione Esplora da qui in una finestra di dialogo di drill-down.

Questo evento è annullabile, il che significa che l'applicazione di incorporamento può restituire {cancel: true} e Looker non procederà con l'evento di attivazione.

type: "drillmodal:explore",
label: "Explore From Here",
url: "/embed/explore/model/view..."
Attributo Formato Descrizione
label Stringa L'etichetta del pulsante visualizzata nel menu di visualizzazione in dettaglio
url Stringa L'URL di esplorazione relativo (solo il percorso) da visualizzare

explore:ready

Questo evento viene creato quando un'esplorazione inizia a caricare i dati della query, indipendentemente dal fatto che la query venga eseguita o meno.

type: "explore:ready",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
  }
Attributo Formato Descrizione
explore.url Stringa L'URL di esplorazione relativo (solo il percorso)
explore.absoluteUrl Stringa L'URL di esplorazione completo

explore:run:start

Questo evento viene creato quando un'esplorazione inizia a caricare i dati della query e la query inizia a essere eseguita.

type: "explore:run:start",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
  }
Attributo Formato Descrizione
explore.url Stringa L'URL di esplorazione relativo (solo il percorso)
explore.absoluteUrl Stringa L'URL di esplorazione completo

explore:run:complete

Questo evento viene creato quando un'esplorazione ha terminato l'esecuzione della query.

type: "explore:run:complete",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/...",
  }
}
Attributo Formato Descrizione
explore.url Stringa L'URL di esplorazione relativo (solo il percorso)
explore.absoluteUrl Stringa L'URL di esplorazione completo

explore:state:changed

Questo evento viene creato quando l'URL di una pagina Esplora cambia in seguito alle azioni dell'utente.

type: "explore:state:changed",
explore: {
  url: "/embed/explore/...",
  absoluteUrl: "https://instance_name.looker.com/embed/explore/..."
}
Attributo Formato Descrizione
explore.url Stringa L'URL di esplorazione relativo (solo il percorso)
explore.absoluteUrl Stringa L'URL di esplorazione completo

merge:ready

Questo evento viene creato quando una query di unione termina il caricamento dei dati della query iniziale.

{
  type: "merge:ready",
  mergeQuery: {
    id: "123",
    client_id: "abc"
  }
}
Attributo Formato Descrizione
mergeQuery.id Stringa L'ID della query di unione.
mergeQuery.client_id Stringa L'ID client della query di unione.

merge:run:start

Questo evento viene creato quando inizia l'esecuzione di una query di unione.

{
  type: "merge:run:start",
  mergeQuery: {
    id: "123",
    client_id: "abc"
  }
}
Attributo Formato Descrizione
mergeQuery.id Stringa L'ID della query di unione.
mergeQuery.client_id Stringa L'ID client della query di unione.

merge:run:complete

Questo evento viene creato quando una query di unione ha terminato l'esecuzione.

{
  type: "merge:run:complete",
  mergeQuery: {
    id: "123",
    client_id: "abc"
  }
}
Attributo Formato Descrizione
mergeQuery.id Stringa L'ID della query di unione.
mergeQuery.client_id Stringa L'ID client della query di unione.

merge:run:fail

Questo evento viene creato quando una query di unione non viene eseguita e restituisce un errore.

{
  type: "merge:run:fail",
  mergeQuery: {
    id: "123",
    client_id: "abc"
  },
  error: "Execution timeout"
}
Attributo Formato Descrizione
mergeQuery.id Stringa L'ID della query di unione.
mergeQuery.client_id Stringa L'ID client della query di unione.
error Stringa Il messaggio di errore restituito quando l'esecuzione della query di unione non riesce.

page:changed

Questo evento viene creato quando un utente accede a una nuova pagina all'interno dell'iframe.

type: "page:changed",
page: {
  type: "dashboard",
  url: "/embed/dashboards/...",
  absoluteUrl: "https://instance_name.looker.com/embed/dashboards/..."
}
Attributo Formato Descrizione
page.type Stringa Il tipo di pagina a cui è stato appena eseguito l'accesso, ad esempio "dashboard", "look" o "explore"
page.url Stringa L'URL relativo (solo il percorso) della pagina appena visitata.
page.absoluteUrl Stringa L'URL completo della pagina appena visitata

page:properties:changed

Questo evento viene creato quando l'altezza di un iframe della dashboard cambia. Non è disponibile per i Look o le esplorazioni perché l'altezza di questi elementi viene regolata automaticamente in base alle dimensioni dell'iframe.

type: "page:properties:changed",
height: 1000
Attributo Formato Descrizione
height Numero intero L'altezza dell'iframe della dashboard in pixel

session:tokens

Questo evento indica che il client Looker richiede i token per continuare. Questo evento viene creato immediatamente alla creazione dell'iframe e, successivamente, periodicamente per tutta la durata della sessione.

{
  "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
}
Attributo Formato Descrizione
authentication_token Stringa Token di autenticazione. Incluso quando viene creato l'iframe. Non incluso nella risposta a una richiesta di generazione di token o se la sessione è scaduta.
authentication_token_ttl Numero Durata (TTL) del token di autenticazione in secondi. Incluso quando viene creato l'iframe. Non incluso nella risposta a una richiesta di generazione di token o se la sessione è scaduta.
api_token Stringa Token API. Non incluso se la sessione è scaduta.
api_token_ttl Numero Durata (TTL) del token API in secondi. Non incluso se la sessione è scaduta.
navigation_token Stringa Token di navigazione. Non incluso se la sessione è scaduta.
navigation_token_ttl Numero Durata del token di navigazione in secondi. Non incluso se la sessione è scaduta.
session_references_token_ttl Numero Durata della sessione in secondi. Il valore sarà 0 quando la sessione è scaduta. Per il ripristino, l'applicazione di incorporamento deve acquisire una nuova sessione.

session:expired

Aggiunto il 25/10 Questo evento viene attivato quando la sessione dell'utente incorporato scade.

type: "session:expired",

Questo evento non ha un payload.

session:status

L'evento viene generato quando l'applicazione Looker incorporata gestisce le richieste di token di sessione.

{
  "type": "session:status",
  "session_ttl": 0,
  "expired": true,
  "interrupted": false
}
Attributo Formato Descrizione
session_ttl Numero Durata della sessione in secondi.
expired Booleano Quando è true, indica che la sessione è scaduta.
interrupted Booleano Quando true, indica che non è stata ricevuta risposta a una richiesta di token di sessione. Ciò potrebbe indicare che un server non è temporaneamente disponibile.
recoverable Booleano Compilato solo quando l'interruzione è true. Indica se la sessione può essere recuperata o meno. Un valore pari a false probabilmente indica un problema con l'applicazione di incorporamento.

env:client:dialog

L'evento viene generato quando viene aperta una finestra di dialogo che potrebbe essere parzialmente fuori visualizzazione, ad esempio una finestra di dialogo di visualizzazione in dettaglio. Questo evento consente all'applicazione in hosting di scorrere la finestra di dialogo nella visualizzazione con l'azione env:host:scroll.

{
  type: "env:client:dialog",
  dialogType: 'drilling',
  placement: 'cover',
  open: true
}
Attributo Formato Descrizione
type Stringa env:client:dialog indica che è stata aperta o chiusa una finestra di dialogo. È supportata solo la finestra di dialogo di visualizzazione in dettaglio, ma in futuro potrebbero essere aggiunte altre finestre di dialogo. È possibile che la parte superiore della finestra di dialogo di visualizzazione in dettaglio non sia visibile, poiché la finestra di dialogo copre l'area visibile dell'iframe. Questo evento consente all'applicazione in hosting di scorrere la parte superiore della finestra di dialogo per visualizzarla.
dialogType Stringa Il tipo di finestra di dialogo. Solo l'apertura o la chiusura del tipo di finestra di dialogo "drilling" attiva questo evento.
placement Stringa Il posizionamento della finestra di dialogo. Le finestre di dialogo di tipo "drilling" utilizzano sempre un placement di "cover".
open Booleano Indica se la finestra di dialogo è aperta o se è stato eseguito lo scorrimento.

Apportare modifiche all'iframe

Dopo aver preparato l'iframe per il recupero dei dati, puoi apportare modifiche all'iframe seguendo questi passaggi:

  1. Scrivi la richiesta in JSON.
  2. Pubblica la richiesta nel contentWindow dell'iframe.

Scrittura della richiesta in JSON

Puoi apportare diverse modifiche all'iframe, che invierai in formato JSON. Le opzioni disponibili sono descritte nella sezione Riferimento per le azioni di questa pagina. Non dimenticare di utilizzare JSON.stringify per trasformare l'azione in JSON, in questo modo:

var my_request = JSON.stringify(
  {
    type: "dashboard:run"
  }
);

Pubblicazione della richiesta nella proprietà contentWindow dell'iframe

Infine, pubblica il messaggio nell'oggetto contentWindow dell'iframe, in questo modo:

var my_iframe = document.getElementById("my_iframe_id");

my_iframe.contentWindow.postMessage(my_request, 'https://instance_name.looker.com');

Tabella di riepilogo delle azioni

La tabella seguente riassume le azioni. Seleziona un'azione per visualizzarne i dettagli.

Azione Descrizione azione
page:load Carica una nuova pagina nell'iframe, sostituendo quella esistente.
dashboard:load Carica una nuova dashboard nell'iframe, sostituendo una dashboard esistente.
dashboard:run Esegue la dashboard nell'iframe.
dashboard:edit Aggiunta 22.20 Passa alla modalità di modifica della dashboard.
dashboard:filters:update Aggiorna un filtro della dashboard esistente nell'iframe.
dashboard:options:set Scrive nuovi valori nelle proprietà del layout e degli elementi della dashboard.
dashboard:schedule_modal:open Apre lo Scheduler, che consente agli utenti di inviare contenuti di Looker a varie destinazioni.
dashboard:stop Interrompe una dashboard in esecuzione o che sta ricaricando i dati.
look:run Esegue il Look nell'iframe.
look:filters:update Aggiorna un filtro Look esistente nell'iframe.
explore:run Esegue l'esplorazione nell'iframe.
explore:filters:update Aggiorna o rimuove un filtro Esplora esistente nell'iframe.
merge:run Esegue la query di unione nell'iframe.
session:tokens:request Invia token in risposta a un evento session:tokens:request.
env:host:scroll Invia informazioni sulla posizione di scorrimento corrente dell'iframe host all'applicazione Looker incorporata.

Riferimento all'azione

Di seguito sono riportate le azioni disponibili che puoi pubblicare nell'iframe incorporato:

page:load

Utilizza questa azione per passare a nuovi contenuti all'interno dell'iframe, sostituendo i contenuti esistenti. Questa azione è simile all'azione dashboard:load, ma è più flessibile, in quanto nell'URL è possibile specificare parametri aggiuntivi.

Esistono differenze di comportamento che devono essere prese in considerazione prima di utilizzare page:load. dashboard:load impedirà la navigazione se la dashboard corrente è in fase di modifica. page:load non impedisce la navigazione. L'applicazione in hosting può determinare se una dashboard o un Look è in fase di modifica monitorando dashboard:edit:start, look:edit:start e i relativi eventi di fine modifica. Per questo motivo, ti consigliamo di utilizzare l'SDK di incorporamento. L'SDK di incorporamento monitora se una dashboard o un Look è in fase di modifica, pertanto è possibile eseguire una query sulla connessione per verificare se i contenuti sono in fase di modifica prima della navigazione.

{
    type: 'page:load',
    url: '/embed/dashboard/32?state=california,
    pushHistory: false
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo page:load indica che vuoi caricare nuovi contenuti nell'iframe.
url Stringa L'URL dei contenuti da caricare.
pushHistory Booleano Se true, i contenuti caricati creano una nuova voce nella cronologia di navigazione del browser e l'utente può utilizzare il pulsante Indietro del browser per tornare ai contenuti precedenti. Se false, i contenuti correnti vengono sostituiti e non è possibile utilizzare la navigazione del browser per tornare ai contenuti precedenti.

dashboard:load

Utilizza questa azione per caricare una nuova dashboard nell'iframe, sostituendo una dashboard esistente. La nuova dashboard inizierà a eseguire query come se fosse stata aperta una nuova pagina della dashboard.

{
  type: "dashboard:load",
  id: "101",
  pushHistory: false
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:load indica che vuoi caricare una nuova dashboard nell'iframe.
id Stringa L'ID della dashboard da caricare.
pushHistory Booleano Se true, la dashboard caricata crea una nuova voce nella cronologia di navigazione del browser e l'utente può utilizzare il pulsante Indietro del browser per tornare alla dashboard precedente. Se false, la dashboard corrente viene sostituita e non è possibile utilizzare la navigazione del browser per tornare alla dashboard.

dashboard:run

Utilizza questa azione per eseguire la dashboard nell'iframe. Questa azione equivale a fare clic sul pulsante Esegui o Ricarica dati nella dashboard.

{
  type: "dashboard:run"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:run indica che vuoi eseguire la dashboard.

dashboard:edit

Aggiunta 22.20 Utilizza questa azione per passare alla modalità di modifica di una dashboard esistente nell'iframe. Questa azione equivale a selezionare Modifica dashboard dal menu della dashboard.

{
  type: "dashboard:edit"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:edit indica che vuoi passare alla modalità di modifica della dashboard.

dashboard:filters:update

Utilizza questa azione per aggiornare un filtro della dashboard esistente nell'iframe. Non puoi aggiungere un nuovo filtro alla dashboard utilizzando questo metodo.

{
  type: "dashboard:filters:update",
  filters: {
    "Sale date": "Last 28 days",
    "Sale amount": "Greater than 100"
  }
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:filters:update indica che vuoi aggiornare i filtri utilizzati dalla dashboard.
filters Oggetto I nuovi filtri che vuoi applicare alla dashboard. Questo oggetto ha il formato: {"Filter name 1": "value 1", "Filter name 2": "value 2", ...}

dashboard:options:set

Questa azione è disponibile dopo che si è verificato l'evento dashboard:run:complete.

L'incorporatore crea il messaggio e lo invia all'iframe, ma la dashboard non risponde finché non si verifica dashboard:run:complete. L'azione dashboard:options:set scrive nuovi valori nelle proprietà del layout e degli elementi della dashboard. Solo le proprietà restituite nell'attributo options dell'evento dashboard:run:complete possono essere aggiornate utilizzando dashboard:options:set. Eventuali proprietà impostate che non sono state restituite in precedenza dall'attributo options dell'evento dashboard:run:complete vengono ignorate.

{
  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"
      }
    }
  }
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:options:set indica che vuoi scrivere nuovi valori nelle proprietà del layout e degli elementi della dashboard.
layouts Oggetto Le proprietà del layout della dashboard restituite dall'attributo options nell'evento dashboard:run:complete. Il formato sarà simile al seguente:

  • id: "string",
  • dashboard_id: "string",
  • type: "newspaper",
  • active: boolean,
  • column_width: number,
  • width: number
layouts.dashboard_layout_components Oggetto Uno o più oggetti componente di layout della dashboard restituiti dall'attributo options nell'evento dashboard:run:complete. Il formato sarà simile al seguente:

  • id: "string",
  • dashboard_layout_id: "string",
  • dashboard_element_id: "string",
  • row: number,
  • column: number,
  • width: number,
  • height: number,
  • deleted: boolean,
elements Oggetto Uno o più oggetti elemento della dashboard restituiti dall'attributo options nell'evento dashboard:run:complete. Il formato sarà simile al seguente:

id: {

  title: "string",

  title_hidden: boolean,

  vis_config: {

    type: "string", title: "string"

  }

}

dashboard:schedule_modal:open

Utilizza questa azione per aprire lo scheduler, che consente agli utenti di inviare contenuti di Looker a varie destinazioni.

{
  type: "dashboard:schedule_modal:open"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:schedule_modal:open indica che vuoi aprire la finestra di dialogo Pianifica.

dashboard:stop

Utilizza questa azione per interrompere una dashboard in esecuzione o che sta ricaricando i dati. Questa azione equivale a fare clic sul pulsante Annulla nella dashboard. Una dashboard che viene interrotta utilizzando dashboard:stop invia un evento dashboard:run:complete con status: impostato su "stopped".

{
  type: "dashboard:stop"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo dashboard:stop indica che vuoi arrestare la dashboard in esecuzione.

look:run

Utilizza questa azione per eseguire la query su cui si basa il Look nell'iframe. Questa azione è simile alla selezione del pulsante Esegui nel Look, con l'eccezione che look:run esegue sempre query direttamente sul database e non recupera i dati dalla cache di Looker.

{
  type: "look:run"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo look:run indica che vuoi eseguire il look.

look:filters:update

Utilizza questa azione per aggiornare un filtro Look esistente nell'iframe. Non puoi aggiungere un nuovo filtro al Look utilizzando questo metodo.

{
  type: "look:filters:update",
  filters: {
    "orders.created_at": "90 days",
    "products.department": "sweaters"
  }
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo look:filters:update indica che vuoi aggiornare i filtri utilizzati dal Look.
filters Oggetto I nuovi filtri che vuoi applicare al Look. Questo oggetto ha il formato: {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...}

explore:run

Utilizza questa azione per eseguire l'esplorazione nell'iframe. Questa azione è simile alla selezione del pulsante Esegui in Esplora, con l'eccezione che explore:run esegue sempre query direttamente sul database e non recupera i dati dalla cache di Looker.

{
  type: "explore:run"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo explore:run indica che vuoi eseguire l'esplorazione.

explore:filters:update

Utilizza questa azione per aggiornare o rimuovere un filtro Esplora esistente nell'iframe. Se includi un nuovo filtro che fa riferimento a un campo valido, il nuovo filtro verrà aggiunto all'esplorazione.

{
  type: "explore:filters:update",
  filters: {
    "orders.created_at": "90 days",
    "orders.status": "complete"
  }
  deleteFilters:  ["products.department"]
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo explore:filters:update indica che vuoi aggiornare i filtri utilizzati dall'esplorazione.
filters Oggetto I nuovi filtri che vuoi applicare all'esplorazione. Se filters include un filtro che non esiste nell'esplorazione, ma che fa riferimento a un campo valido, questo filtro verrà aggiunto all'esplorazione. Questo oggetto ha il formato {"view_name.field_name_1": "value 1", "view_name.field_name_1": "value 2", ...}.
deleteFilters Array I filtri esistenti che vuoi rimuovere dall'esplorazione. L'array ha il formato: ["view_name.field_name_1", "view_name.field_name_2", ...]

merge:run

Utilizza questa azione per eseguire la query di unione nell'iframe.

{
  type: "merge:run"
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo merge:run indica che vuoi eseguire la query di unione.

session:tokens:request

Utilizza questa azione per inviare token in risposta a una richiesta session:tokens:request.

{
  type: "session:tokens:request",
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo session:tokens:request indica che vuoi inviare token in risposta a un evento session:tokens:request.

env:host:scroll

Utilizza questa azione per inviare informazioni sulla posizione di scorrimento corrente dell'iframe host all'applicazione Looker incorporata.

{
  type: "env:host:scroll",
  offsetTop: 10,
  offsetLeft: 10,
  scrollX: 5,
  scrollY: 5
}
Attributo Formato Descrizione
type Stringa L'utilizzo del tipo env:host:scroll indica che vuoi inviare informazioni sulla posizione di scorrimento corrente dell'iframe host all'applicazione Looker incorporata.
offsetTop Numero L'offset superiore dell'iframe.
offsetLeft Numero L'offset sinistro dell'iframe.
scrollX Numero La posizione scrollX dell'host dell'applicazione.
scrollY Numero La posizione scrollY dell'host dell'applicazione.