/ /

Opções

Página inicial do Docs

/ /

Incorporar um painel

Opções

Página inicial do Docs

Métodos e opções do SDK do painel incorporado

O SDK de incorporação fornece o método JavaScript createDashboard() para renderizar um painel dentro de uma página da web. Você pode usar opções para controlar muitos aspectos de um dashboard (por exemplo, altura e largura).

Exemplo

O exemplo seguinte demonstra como utilizar o método createDashboard com opções que especificam a altura e largura do dashboard.

const dashboard = sdk.createDashboard({
  dashboardId: "8d4dff93-e7ca-4ccd-a622-e20e8a100197",
  baseUrl: "https://charts.mongodb.com/dashboards-embedding-examples-hmewt",
  height: 300,
  width: 400
});

Opções de Painel Incorporado `createDashboard()`

O método createDashboard() utiliza as seguintes opções:

Opção	Tipo	Descrição	Obrigatório?
`autoRefresh`	booleano	Sinalizador que especifica se o dashboard é atualizado automaticamente. Se omitidos, os dashboards não são atualizados automaticamente. Use essa opção com a opção `maxDataAge` para configurar a frequência de atualização automática do dashboard.	no
`background`	string	Cor de plano de fundo a ser aplicada ao seu dashboard em vez do plano de fundo `theme` . Você pode especificar: Um código hexadecimal de cor Um nome de corCSS Um plano de fundo transparente usando o valor `transparent` Se omitido, a cor de fundo tem como padrão o `theme` atual : `#F1F5F4` para o tema `light` ou `#12212C` para o tema `dark` .	no
`baseUrl`	string	URL base do dashboard.	sim
`dashboardId`	string	Sequência exclusiva que identifica o dashboard.	sim
`getUserToken`	objeto	Função que retorna um token JSON web token codificado em `base64` . Charts valida esse token para determinar se um dashboard autenticado deve ser renderizado. Se você habilitou o acesso autenticado, os Atlas Charts renderizarão a visualização do painel autenticado somente se os Charts puderem validar o token utilizando osprovedores de autenticação configurados do . Se o token for inválido, os Charts não renderizarão o painel. Se você habilitou o acesso não autenticado, os Atlas Charts sempre renderizarão a visualização do painel não autenticado. Para saber mais, consulte Incorporar um gráfico autenticado usando um provedor JSON web token personalizado.	no
`height`	número	Altura do painel. Se omitido, o padrão é a altura do container. Se você fornecer um valor sem unidades, o padrão será pixels (px).	no
`maxDataAge`	número	Idade máxima dos dados a serem carregados do cache ao carregar ou atualizar o dashboard. Se omitido, o Atlas Charts renderiza o dashboard com dados do cache somente se os dados tiverem menos de uma hora. Se os dados do cache tiverem mais de uma hora, o Charts fará uma query ao conjunto de dados para obter os dados mais recentes, atualizará o cache e renderizará o dashboard usando esses dados. Para saber como o Atlas Charts carrega dados do cache ao carregar ou atualizar o dashboard com base nos valores `autoRefresh` e `maxDataAge` , consulte Atualizar e Comportamento de Cache de Dados.	no
`showAttribution`	booleano	Especifica se o logotipo MongoDB deve ser exibido abaixo do dashboard. O padrão é `true`.	no
`theme`	string	Tema a ser usado no painel. As seguintes opções são válidas: `light` para um plano de fundo claro com texto escuro e elementos do painel, ou `dark` para um plano de fundo escuro com texto claro e elementos do painel. Se omitido, o padrão é `light`.	no
`width`	número	Largura do painel. Se omitido, o padrão é a largura do container. Se você especificar um valor sem unidades, o padrão será pixels (px).	no

Após o dashboard ser criado, você pode controlar a configuração do dashboard chamando métodos na instância do Dashboard retornada por DashboardsEmbedSDK.createDashboard({ ... }).

Métodos de configuração do dashboard

Após criar um dashboard, você pode controlar a configuração do dashboard chamando métodos na instância do Dashboard retornada por DashboardsEmbedSDK.createDashboard({ ... }).

`getChart('<chartID>')`

Recupera um gráfico específico do dashboard incorporado usando a string chartId do gráfico. Após chamar esse método, você pode destacar elementos ou filtrar dados no gráfico.

`setAutoRefresh()`

Sinalizador que especifica se o dashboard é atualizado automaticamente. Se omitidos, os dashboards não são atualizados automaticamente.

Use este método com o método setMaxDataAge para configurar com que frequência o dashboard é atualizado.

`setMaxDataAge()`

Idade máxima dos dados a serem carregados do cache ao carregar ou atualizar o dashboard. Se omitido, o Atlas Charts renderiza o dashboard com dados do cache somente se os dados tiverem menos de uma hora.

Se os dados do cache tiverem mais de uma hora, o Charts fará uma query ao conjunto de dados para obter os dados mais recentes, atualizará o cache e renderizará o dashboard usando esses dados.

Para saber como o Atlas Charts carrega dados do cache ao carregar ou atualizar o dashboard com base nos valores setAutoRefresh e setMaxDataAge , consulte Atualizar e Comportamento de Cache de Dados.

`setTheme(theme: 'dark' | 'light')`

Tema atual do painel incorporado. Ao configurar o tema para dark, certifique-se de que a cor de fundo do seu dashboard tenha o contraste apropriado para que as informações fiquem visíveis.

Dica

Exemplo de configuração do dashboard

Os trechos de código de exemplo configuram as seguintes opções para uma instância do Painel denominada dashboard:

O tema para dark
A taxa de atualização automática a cada 60 segundos

dashboard.setTheme("dark");
dashboard.setAutoRefresh(true);
dashboard.setMaxDataAge(60);

Voltar

Opções

Configurar estilo e tema do Iframe

Exemplo

Opções de Painel Incorporado createDashboard()

Métodos de configuração do dashboard

getChart('<chartID>')

setAutoRefresh()

setMaxDataAge()

setTheme(theme: 'dark' | 'light')

Dica

Exemplo de configuração do dashboard

Opções de Painel Incorporado `createDashboard()`

`getChart('<chartID>')`

`setAutoRefresh()`

`setMaxDataAge()`

`setTheme(theme: 'dark' | 'light')`