Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
A biblioteca de componentes do Looker permite que os aplicativos usem elementos de design, padrões UI e visualizações de dados do Looker, tudo pela interface de componentes do React. Alguns exemplos de componentes incluem formulários, botões, entradas de filtro, controles de paginação, layouts, gráficos de linhas, gráficos de barras, gráficos de dispersão, tabelas e muito mais.
Embora o tempo rápido até o valor seja um dos pontos fortes dos componentes, eles realmente se destacam ao permitir experiências mais integradas entre o Looker e aplicativos personalizados.
Veja alguns casos de uso comuns:
Criar UI semelhante ao Looker, como navegação de página, em uma extensão do Looker
Criar UI semelhante ao Looker, como filtros de painel, em torno do conteúdo incorporado do Looker
Fornecer uma visualização individual mais leve em um aplicativo de análise incorporada sem a experiência completa de uma incorporação de iframe
Como usar componentes
Como são componentes do React, os componentes do Looker são publicados no NPM e podem ser adicionados com facilidade ao seu aplicativo JavaScript ou TypeScript de front-end usando o NPM.
Como são componentes do React, os componentes do Looker são publicados no NPM e podem ser adicionados ao seu aplicativo JavaScript ou TypeScript de front-end usando o NPM.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Difícil de entender","hardToUnderstand","thumb-down"],["Informações incorretas ou exemplo de código","incorrectInformationOrSampleCode","thumb-down"],["Não contém as informações/amostras de que eu preciso","missingTheInformationSamplesINeed","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2025-09-05 UTC."],[],[],null,["# Looker components overview\n\nLooker's component library allows applications to leverage Looker's design elements, UI patterns, and data visualizations, all through the interface of React components. Some examples of components include forms, buttons, filter inputs, pagination controls, layouts, line charts, bar charts, scatterplot charts, tables, and more.\n\nWhile quick time-to-value is one of the strengths of components, where they really shine is in enabling more seamless experiences between Looker and custom-built applications.\n\nSome common use cases include:\n\n- Creating Looker-like UI, such as page navigation, within a Looker extension\n- Creating Looker-like UI, such as dashboard filters, around embedded Looker content\n- Delivering a lighter-weight individual visualization within an embedded analytics application without the full experience of an [iframe embed](/looker/docs/single-sign-on-embedding)\n\nUsing components\n----------------\n\nBeing React components, Looker components are published to NPM and can be [conveniently added](/looker/docs/components-getting-started) to your front-end Javascript or TypeScript application using NPM.\n\nBeing React components, Looker components are published to NPM and can be [added](/looker/docs/components-getting-started) to your frontend Javascript or TypeScript application using NPM.\n\nSeparate NPM packages are available for [UI components](https://www.npmjs.com/package/@looker/components) and [filter components](https://www.npmjs.com/package/@looker/filter-components).\n\nTry it out\n----------\n\nWant to see Looker components in action before writing any code? This demo can help:\n\n- [Atom Fashion](https://atomfashion.io/analytics/home): a demo data-driven web application built using Looker components (requires Google account to log in)"]]