Componenti della visualizzazione di Looker

I componenti di visualizzazione di Looker sono una suite di componenti basati su React disponibili nel pacchetto @looker/visualizations open source.

I componenti di visualizzazione accettano un valore Query.client_id o un ID query da un'esplorazione di Looker o un ID dashboard da una dashboard di Looker e mostrano una visualizzazione lato client senza un iframe.

Questi componenti possono essere utilizzati da subito, personalizzati o trattati come puri formattatori di dati per trasferire dati puliti da un'esplorazione di Looker e facilitare la creazione di visualizzazioni personalizzate.

I componenti di visualizzazione di Looker sono progettati per essere utilizzati in un ambiente React autenticato con l'API di Looker mediante l'SDK TypeScript/JavaScript. Questo passaggio viene gestito automaticamente quando crei con il framework di estensione Looker.

Creazione di visualizzazioni con i componenti di visualizzazione di Looker

La suite di componenti di visualizzazione di Looker fornisce due componenti di alto livello per l'elaborazione dei dati:

  • Query: gestisce il recupero dei dati e carica la risposta nel contesto della reazione
  • Visualization: accetta i dati restituiti da Query e utilizza gli adattatori di configurazione per eseguire il rendering del grafico adeguatamente personalizzato in una pagina

Attualmente, i dati possono essere visualizzati nei seguenti tipi di grafici:

  • A linee
  • Area
  • A dispersione
  • Sparkline
  • Valore singolo
  • A barre
  • Colonna
  • Tabella
  • Torta

Sono in fase di sviluppo altri tipi di grafici.

Per visualizzare le tabelle delle proprietà per ciascun tipo di grafico, consulta la pagina della documentazione relativa alle tabelle delle proprietà di visualizzazione e query.

Per visualizzare le opzioni di configurazione disponibili per ogni tipo di grafico, visualizza il playground di visualizzazione sul portale per gli sviluppatori di Looker.

Perché utilizzare i componenti di visualizzazione?

I componenti di visualizzazione migliorano e semplificano il processo di rendering di una visualizzazione da Looker all'interno di un'applicazione, fanno risparmiare tempo agli sviluppatori e offrono agli sviluppatori più opzioni per personalizzare ed estendere le proprie visualizzazioni da Looker.

  • Incorporamento migliorato: i componenti di visualizzazione consentono agli sviluppatori di incorporare una visualizzazione Looker in un'applicazione senza un iframe. Ciò può migliorare le prestazioni, il monitoraggio e la possibilità di personalizzazione.
  • Integrazione semplice: i componenti di visualizzazione possono essere combinati con altri componenti di @looker/components per creare composizioni ed esperienze front-end completamente nuove.
  • Personalizzazione: utilizzando i componenti di visualizzazione, è più facile personalizzare le visualizzazioni incorporate rispetto agli iframe. Inoltre, con i componenti di visualizzazione, gli sviluppatori possono creare applicazioni altamente personalizzate in modo molto più rapido, senza dover creare un livello di visualizzazione da zero.
  • Semplificazione: i componenti di visualizzazione migliorano la portabilità delle visualizzazioni di Looker e semplificano le interazioni con l'API Looker.

Installazione dei componenti di visualizzazione

Per iniziare, aggiungi il pacchetto Gestione dei partner di rete dei componenti di visualizzazione Looker:

  • Gestione partner di rete: npm install @looker/visualizations
  • FILATO: yarn add @looker/visualizations

Dovrai anche soddisfare alcune dipendenze tra peer, ovvero Looker/componenti, Reazione e Componenti con stili:

  • Gestione partner di rete: npm install @looker/components react react-dom styled-components
  • FILATO: yarn add @looker/components react react-dom styled-components

Le informazioni sull'installazione e sull'utilizzo del pacchetto dei componenti di visualizzazione sono disponibili nel documento README, disponibile in GitHub e NPM.

Passaggi successivi