Menu Docs
Página inicial do Docs
/
Atlas Charts
/ /

Filtrar gráficos incorporados

Nesta página

  • Especificar campos filtráveis
  • Especificar subcampos filtráveis para campos com documentos incorporados
  • Dados pré-filtrados em Charts incorporados em um iframe
  • Exemplo de pré-filtro
  • Filtrar dados em Charts incorporados em um iframe
  • Sintaxe de filtro
  • Dados pré-filtro em Charts incorporados com o SDK
  • Filtrar dados em Charts incorporados com o SDK
  • Injetar filtros específicos do usuário

Você pode personalizar seus gráficos incorporados adicionando:

  • Pré-filtros. Use a opção preFilter com o SDK de incorporação de Charts ou acrescente vários parâmetros de consulta aos URLs de iframe.

  • Filtros. Use a opção filter com o SDK de incorporação de Charts ou acrescente vários parâmetros de consulta às URLs de iframe.

Você pode usar pré-filtros e filtros no mesmo dashboard, embora seu uso seja opcional. Se especificado, os pré-filtros sempre são executados após as visualizações do gráfico e antes das queries e filtros do dashboard.

Observação

Para incorporar Atlas Charts de seus painéis, você deve configurar as opções de incorporação em seu conjunto de dados. Para obter instruções, consulte:

  • Incorpore gráficos em seu aplicativo da web

Você pode filtrar Atlas Charts incorporados e Atlas Charts em dashboards incorporados.

Um autor de gráfico especifica os campos que podem ser incluídos em pré-filtros e filtros definidos pelo código do aplicação de incorporação ou adicionados por visualizadores de gráficos. Um autor de gráfico pode limitar o acesso aos dados permitindo que apenas determinados campos sejam pré-filtrados ou filtrados. Por padrão, nenhum campo é permitido, o que significa que o gráfico não pode ser pré-filtrado ou filtrado até que você permita explicitamente pelo menos um campo.

Para definir campos filtráveis para pré-filtros e filtros:

  1. Navegue até o painel que contém o gráfico onde você deseja definir os campos filtráveis.

  2. Para o gráfico desejado, clique em botão e selecione Embed Chart no menu suspenso.

  3. Na seção Allowed filter fields , use o menu suspenso para selecionar quais campos os visualizadores do gráfico podem usar para filtrar dados no gráfico. Você também pode digitar valores manualmente para adicionar campos não listados no menu suspenso.

    Observação

    Essa opção só aparece se você já tiver o acesso de incorporação Não Autenticado ou Autenticado habilitado.

    Para especificar em quais campos os visualizadores do gráfico podem pré-filtrar ou filtrar dados, você pode:

    • Use o menu suspenso para selecionar os campos.

    • Digite valores manualmente para adicionar campos não listados no menu suspenso.

    • Selecione Allow all fields in the data source used in this chart.

  4. Após selecionar todos os campos desejados, clique em Save abaixo do menu suspenso.

Os visualizadores do gráfico e os aplicativos que renderizam o gráfico agora podem usar pré-filtros e filtros com base nos campos especificados para exibir subconjuntos dos dados originais do gráfico. Se um visualizador tentar usar um filtro para um campo não incluído na lista Campos de filtro permitidos , o Atlas Charts retornará um erro.

Ao adicionar um campo à lista Allowed filter fields cujo valor é um documento incorporado, você também deve especificar cada subcampo individual que deseja permitir.

Exemplo

Considere o seguinte documento:

{
"name": "Alice",
"favorites" :
{
"color": "green",
"animal": "turtle",
"season": "autumn"
}
}

Se você adicionar apenas o campo favorites à lista de campos permitidos, ele não concederá aos visualizadores permissão para filtrar nenhum dos subcampos de favorites. Em vez disso, você pode adicionar um ou mais dos sub-campo à lista individualmente especificando favorites.color, favorites.animal ou favorites.season.

Use pré-filtros para gráficos e painéis incorporados com um grande número de coleções. Os pré-filtros são executados em um estágio anterior no pipeline do gráfico incorporado e permitem que você faça o seguinte:

  • Filtre os dados antecipadamente para reduzir o tempo de execução da query.

  • Aplique filtros antes da execução da query para queries de gráficos que contenham agregações.

Os pré-filtros se comportam exatamente como filtros e usam a mesma sintaxe. A única diferença é que eles são executados após as visualizações de gráficos e antes do início das consultas e filtros de gráficos. Para saber mais sobre a ordem dos segmentos de pipeline, consulte agregação pipeline.

Utilize o parâmetro de query preFilter para filtrar dados antes que a query de gráfico comece a ser executada, para o gráfico incorporado em um iframe.

Você pode especificar um documento MQL como seu parâmetro de consulta do preFilter desde que os campos utilizados no seu filtro estejam na lista de campos filtráveis permitidos.

O exemplo a seguir ilustra como as visualizações de gráfico, as queries na barra de query, os filtros e os pré-filtros funcionam juntos.

Considere o seguinte cenário:

  • A visualização de Charts contém:

    [ { $project: { accommodates: 1, "bedrooms": 1, "address.country": 1 } } ]
  • A barra de query contém:

    [ { $match: { accommodates: { $gte: 3 } } }, { $project: { address: 0 } } ]
  • O filtro em um gráfico incorporado contém:

    { "bedrooms": { $lte: 3 } }
  • O pré-filtro em um gráfico incorporado contém:

    { "address.country": "Australia" }

No exemplo anterior , antes de a query do gráfico começar a ser executada, o pré-filtro é aplicado para procurar apenas apartamentos na Austrália. Em seguida, a query do gráfico é executada para identificar todos os apartamentos que acomodar mais de três pessoas.

Use o parâmetro de query filter para exibir somente dados que correspondam a um filtroMQL especificado em seu gráfico incorporado em um iframe.

Você pode utilizar o parâmetro de query filter em gráficos Unauthenticated e Verified Signature . O comportamento de filtragem é diferente de cada configuração de autenticação:

  • Com gráficos não autenticados, o autor do gráfico especifica os campos que podem ser incluídos nos filtros definidos pelo código do aplicação de incorporação ou adicionados pelos visualizadores de gráficos. Para saber como especificar campos filtráveis, consulte Especificar campos filtráveis.

  • Com gráficos que exigem uma Assinatura Verificada, todos os campos do documento podem ser filtrados, no entanto, você deve gerar o filtro no código do lado do servidor e incluir o filtro como parte da carga útil assinada.

Selecione a guia apropriada para ver um exemplo de como filtrar dados em um gráfico Unauthenticated e um gráfico Verified Signature :

Você pode especificar um documento MQL como seu parâmetro de consulta do filter desde que os campos utilizados no seu filtro estejam na lista de campos filtráveis permitidos.

Seu filtro deve corresponder ao formato usado em uma query $match e ser um:

  • query de nível superior

    Exemplo

    { "quantity": { $gte: 20 } }
  • Ou dentro de expressões booleanas ( $and, $nor, $or)

    Exemplo

    { $or: [ { quantity: { $lt: 20 } }, { price: 10 } ] }

Observação

Você deve codificar caracteres especiais em URL do parâmetro de filtro.

O URL iframe src a seguir renderiza um gráfico que exibe apenas documentos com um imdb.rating maior ou igual a 8:

https://charts.mongodb.com/charts-atlasproject1-piocy/embed/charts?
id=93584ddb-1115-4a12-afd9-5129e47bbb0d&
filter={"imdb.rating":%20{$gte:%208}}&
autoRefresh=60

A URL usa um parâmetro filter codificado de {"imdb.rating":%20{$gte:%208}}. Decodificado, este filtro é:

{"imdb.rating": {$gte: 8}}

Especifique um documento MQL como seu parâmetro de query do filter .

Seu filtro deve corresponder ao formato utilizado em uma query $match como mostrado nos seguintes exemplos:

Exemplo

{ "quantity": { $gte: 20 } }

Exemplo

{ $or: [ { quantity: { $lt: 20 } }, { price: 10 } ] }

Ao usar filtros em uma Assinatura Verificada, as queries MQL contêm caracteres que devem ser codificados em URL antes que o código do lado do servidor calcule a assinatura. Quando o Charts verifica a assinatura, ele codifica o filtro novamente usando o JavaScript URL{ função. Você deve usar o mesmo algoritmo de codificação para codificar seu filtro.

Importante

Você deve codificar espaços em seu filtro como %20, em vez de + ou um espaço bruto.

Para ver como codificar corretamente um MQL filtro usando diferentes linguagens de programação do lado do servidor, consulte Atlas Charts Exemplos de incorporação de Github no .

O URL iframe src a seguir renderiza um gráfico que exibe apenas documentos com um imdb.rating maior ou igual a 8:

https://charts.mongodb.com/charts-atlasproject1-piocy/embed/charts?
id=93584ddb-1115-4a12-afd9-5129e47bbb0d&
timestamp=1564156636&
expires-in=300&
filter=%7B%22imdb.rating%22%3A%20%7B%24gte%3A%208%7D%7D&
autoRefresh=60&
signature=8e0d92b33934c928f6c6974e2f0102ace77f56d851cb0d33893e84c359ab1043

A URL usa um parâmetro filter codificado de %7B%22imdb.rating%22%3A%20%7B%24gte%3A%208%7D%7D. Decodificado, este filtro é:

{"imdb.rating": {$gte: 8}}

Você pode adicionar um preFilter a um gráfico incorporado com a opção preFilter . A pré-filtragem permite que o autor do gráfico execute um filtro após as visualizações do gráfico e antes da execução da consulta do gráfico e dos filtros do gráfico.

No modal Embed Chart , você deve especificar os campos que deseja incluir no pré-filtro. O modal Embed Chart contém um menu suspenso de campos nos quais permitir a filtragem.

O seguinte usa a opção preFilter para representar somente documentos na Austrália:

createChart({
baseUrl: '<your-base-url>',
chartId: '<your-chart-id>',
width: 500,
height: 500,
preFilter: { "address.country": "Australia" }
})

Você pode adicionar um filtro a um gráfico incorporado com a opção filter . A filtragem permite que o autor do gráfico exiba apenas dados no gráfico incorporado que correspondam a um filtro MQL especificado.

No modal Embed Chart , você deve especificar os campos que deseja incluir no filtro. O modal Embed Chart contém um menu suspenso de campos nos quais permitir a filtragem.

O seguinte utiliza a opção filter para representar somente documentos nos quais o campo total é maior que 100:

createChart({
baseUrl: '<your-base-url>',
chartId: '<your-chart-id>',
width: 500,
height: 500,
filter: { "total": { "$gt": 100 } }
})

Ao incorporar um gráfico que exige acesso Authenticated , você pode usar a configuração Injected function para injetar um documento de filtro MongoDB específico para cada usuário que visualizar o gráfico. A função tem acesso ao token do seu Provedor de Autenticação de Incorporação via context.token e pode filtrar os dados do gráfico com base no token.

Esse filtro garante que os visualizadores de um Atlas Charts incorporado vejam apenas seus próprios dados, o que é útil ao incorporar Atlas Charts com informações potencialmente confidenciais.

Observação

Se você usar um provedor de autenticação do Atlas App Services , o context.token conterá o objeto de usuário do App Services para filtrar. Por exemplo, se você habilitar Dados de usuário personalizados para usuários do App Services, o objeto de usuário estará disponível em context.token.custom_data.

Para injetar um filtro específico para cada usuário, na guia Authenticated da caixa de diálogo Embed Chart , defina a configuração Injected function como On. Especifique uma função e clique em Save.

Exemplo

A função de filtro a seguir só renderiza dados em que o campo ownerId de um documento corresponda ao valor do campo sub do token do provedor de autenticação de incorporação:

function getFilter(context) {
return { ownerId: context.token.sub };
}

Voltar

iframe