> ## Documentation Index > Fetch the complete documentation index at: https://docs.get-clara.tech/llms.txt > Use this file to discover all available pages before exploring further. # Configurações do Gráfico > Configure seus gráficos para exibir os dados exatamente como você precisa. export const ChartIcon = ({icon, size = 20}) => { const icons = { 'database': , 'filter': , 'axis-x': , 'axis-y': , 'sum': , 'chart-pie': , 'chart-line': , 'calendar': , 'arrows-sort': , 'filters': , 'chart-bar-popular': , 'math-min': , 'math-max': , 'color-swatch': , 'gizmo': , 'stack-2': , 'badge-2k': , 'text-caption': , 'eye-off': , 'caret-left': , 'caret-right': , 'number-123': , 'frame': , 'align-box-left-top': }; const selectedIcon = icons[icon]; if (!selectedIcon) { return null; } return selectedIcon; }; ## Acessando as configurações do gráfico 1. Clique no botão **Editar** no canto superior direito do seu painel Modo de edição 2. O painel entra no modo de edição 3. Clique em qualquer widget para selecioná-lo 4. O painel de configurações é aberto à direita As configurações são organizadas em seções: * **Dados**: Quais dados obter e como filtrá-los * **Eixo X**: Como agrupar e ordenar categorias (gráficos de barras/linhas) * **Eixo Y**: O que medir e como exibir (gráficos de barras/linhas) * **Estilo**: Cores, rótulos e opções visuais Algumas configurações só aparecem quando outras estão configuradas. Por exemplo, **Granularidade de data** só aparece quando você seleciona um campo de data. *** ## Configurações de Dados ### Fonte Escolha de qual objeto extrair os dados. 1. Clique em **Fonte** 2. Selecione um objeto (Oportunidades, Pessoas, Empresas, etc.) Todos os seus objetos padrão e personalizados estão disponíveis. Alterar a fonte redefine outras configurações, pois as opções de campo dependem do objeto selecionado. Fonte ### Filtro Limite quais registros são incluídos no gráfico. 1. Clique em **Filtrar** 2. O construtor de filtros é aberto 3. Clique em **+ Adicionar filtro** 4. Selecione um campo, condição e valor 5. Adicione mais filtros conforme necessário Os filtros funcionam da mesma forma que nas visualizações de tabela. Use-os para focar em segmentos específicos dos seus dados. **Exemplo**: Filtre oportunidades em que a Etapa seja igual a "Ganha" para mostrar apenas negócios fechados. Filtro Para campos de data, experimente **É relativo** para criar filtros dinâmicos como "Últimos 7 dias" ou "Este mês" que são atualizados automaticamente. Filtros avançados são suportados—adicione várias regras de filtro e combine-as com a lógica **E** ou **Ou**. *** ## Configurações do Eixo X Essas configurações controlam o eixo horizontal dos gráficos de barras e de linhas—geralmente como seus dados são agrupados em categorias. ### Dados em exibição Selecione o campo pelo qual agrupar seus dados. Isso determina as categorias exibidas no eixo X. **Exemplo**: Selecione "Etapa" para ver os dados agrupados pela etapa do pipeline, ou "Data de criação" para ver os dados ao longo do tempo. Dados em exibição ### Granularidade de data Ao agrupar por um campo de data, escolha o período de tempo para o agrupamento. | Opção | Agrupa dados por | Exemplo de saída | | -------------------- | ------------------------ | ------------------------------------------------------------------ | | **Dia** | Cada dia do calendário | 1º de jan., 2 de jan., 3 de jan.... | | **Semana** | Semanas do calendário | Semana 1, Semana 2, Semana 3... | | **Mês** | Meses do calendário | janeiro, fevereiro, março... | | **Trimestre** | Trimestres fiscais | T1, T2, T3, T4 | | **Ano** | Anos do calendário | 2023, 2024, 2025 | | **Dia da semana** | Dia da semana (agregado) | segunda-feira, terça-feira... (todas as segundas-feiras agregadas) | | **Mês do ano** | Mês (agregado) | janeiro, fevereiro... (todos os janeiros agregados) | | **Trimestre do ano** | Trimestre (agregado) | T1, T2, T3, T4 (todos os T1 agregados) | As opções "de semana/ano" agregam ao longo de todo o tempo. Use **Dia da semana** para ver qual dia da semana normalmente tem mais negócios. Use **Mês** para ver tendências mês a mês. ### Ordenar por Controle a ordem das categorias no eixo X. * **Posição** – Usa a ordem definida nas configurações do seu campo Select * **Alfabética** – De A a Z (ou cronológica para datas) * **Por valor** – Ordenado pela métrica (do maior para o menor ou vice-versa) * **Manual** – Arraste para definir sua própria ordem Ordenar por **Dica**: Para etapas do pipeline, use **Posição** para mostrar as etapas na ordem do seu processo de vendas (Lead → Qualificado → Proposta → Ganha). As opções exibidas dependem do tipo do seu campo. Campos Select têm todas as opções; campos de data e de texto exibem menos. Com a ordenação **Manual**, arraste as categorias para criar uma ordem personalizada—perfeito para destacar segmentos específicos ou contar uma história com seus dados. ### Omitir valores zero Oculte categorias que têm zero ou nenhum dado. * **Ativado**: Categorias sem registros são ocultadas * **Desativado**: Todas as categorias são exibidas, mesmo que vazias Use isso para limpar gráficos com dados esparsos. *** ## Configurações do Eixo Y Essas configurações controlam o que você está medindo e como isso é exibido. ### Dados em exibição Selecione o campo e a operação para calcular sua métrica. * **Contagens** – Contar todos, Contar vazios, Contar não vazios, Contar valores únicos * **Matemática** – Soma, Média, Mín., Máx. (campos numéricos) * **Percentuais** – Percentual vazio, Percentual não vazio Campos booleanos adicionam Contar verdadeiro/falso. Gráficos agregados com campos de data exibem Mais antigo/Mais recente. **Exemplo**: Selecione "Valor" com Soma para ver o valor total de negócios por categoria, ou Contar todos para ver o número de negócios. Dados em exibição As opções exibidas dependem do seu campo e do tipo de gráfico. Se você não vir uma operação esperada, verifique o tipo do seu campo. ### Razão Para campos Select, Multi-select ou Booleanos, você pode calcular o percentual de um valor específico. 1. Selecione um campo Select, Multi-select ou Booleano 2. Ativar **Proporção** 3. Escolha a opção a ser medida **Exemplo**: Mostrar negócios "Ganho" como porcentagem de todas as oportunidades. Se você tiver 10 Ganhos de um total de 50, o gráfico mostrará 20%. ### Agrupar por Adicione uma segunda dimensão para criar várias séries (múltiplas barras ou linhas). 1. Defina primeiro o campo do eixo X 2. Clique em **Agrupar por** 3. Selecione um segundo campo **Exemplo**: Agrupe os negócios por Etapa (Eixo X) E por Responsável (Agrupar por) para ver, lado a lado, a distribuição do pipeline de cada pessoa. Agrupar por Quando Agrupar por estiver definido, você verá várias cores em seu gráfico e uma legenda aparecerá. ### Granularidade de data Quando Agrupar por for um campo de data, escolha o período de tempo (mesmas opções do eixo X). ### Ordenar por Quando **Agrupar por** estiver definido, controle a ordem das séries agrupadas (por exemplo, qual barra do responsável aparece primeiro em cada categoria). Mesmas opções da ordenação do eixo X—Posição, Alfabética e Manual—exceto que **a ordenação baseada em valor não está disponível** para o agrupamento secundário. ### Acumulado Mostre totais acumulados em vez de valores individuais. * **Desativado**: Cada barra/ponto mostra seu próprio valor * **Ativado**: Cada barra/ponto mostra a soma de todos os valores anteriores mais o seu próprio **Exemplo**: janeiro = 10, fevereiro = 15 * Acumulado desativado: Mostra 10 e 15 * Acumulado ativado: Mostra 10 e 25 (10 + 15) Use o acumulado para acompanhar o progresso em direção a uma meta ao longo do tempo. Acumulado ### Faixa mínima / Faixa máxima Defina valores mínimos e máximos fixos para o eixo Y. * Deixe em branco para dimensionamento automático * Insira um número para fixar o limite **Quando usar:** * Defina Mín. como 0 para comparações visuais precisas * Defina ambos para escalas consistentes em vários gráficos * Foque em um intervalo de valores específico definindo ambos *** ## Configurações de Estilo ### Cores Defina o esquema de cores do seu gráfico. Escolha entre uma variedade de paletas de cores. Ao agrupar por um campo Select, o gráfico usa automaticamente as cores definidas para cada opção nas configurações do seu campo. ### Nome do eixo Escolha quais rótulos de eixo mostrar: **Nenhum**, **Eixo X**, **Eixo Y** ou **Ambos** (somente gráficos de barras e de linhas). ### Barras empilhadas / Linhas empilhadas Quando Agrupar por estiver definido, escolha como várias séries serão exibidas. * **Desativado (Agrupadas)**: As séries aparecem lado a lado. Use ao comparar valores exatos entre grupos. * **Ativado (Empilhadas)**: As séries são empilhadas umas sobre as outras. Use ao mostrar composição—como as partes compõem o todo. **Exemplo**: Negócios por etapa, agrupados por responsável * Agrupadas: Veja os números exatos de cada responsável lado a lado * Empilhadas: Veja o total de negócios por etapa, com a contribuição de cada responsável empilhada ### Rótulos de dados Mostre valores diretamente nos elementos do gráfico (barras, pontos, fatias). * **Ativado**: Os valores aparecem no gráfico * **Desativado**: Nenhum valor exibido (visual mais limpo) ### Legenda Mostrar ou ocultar a legenda (só aparece quando Agrupar por está definido). * **Ativado**: A legenda mostra o que cada cor representa * **Desativado**: Nenhuma legenda exibida **Passe o mouse** sobre um item da legenda para destacar esse grupo. **Clique** para ocultá-lo temporariamente do gráfico. *** ## Notas específicas do gráfico ### Gráficos de pizza * **Cada fatia representa** – Defina como as fatias são agrupadas * **Ocultar categoria vazia** – Remover fatias de valor zero * **Mostrar valor no centro** – Exibir o valor agregado (soma, média, contagem etc.) ### Gráficos agregados * **Prefixo** – Adicionar texto antes do número (por exemplo, `$`) * **Sufixo** – Adicionar texto após o número (por exemplo, `%`)