Opções de dashboard incorporado

Nesta página

Opções de dashboard incorporado

Configuração do dashboard
getChart('<chartID>')
setAutoRefresh()
setMaxDataAge()
setTheme(theme: 'dark' | 'light')
Exemplo de configuração do dashboard

O SDK de incorporação fornece o método JavaScript createDashboard() para renderizar um dashboard em uma página da web. Você pode usar opções para controlar muitos aspectos de um dashboard (por exemplo, sua 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 dashboard incorporado

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({ ... }).

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

Veja também:

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

iframe