Área empilhada com degradê

Visão geral

Gráficos de área empilhada com degradê combinam a visão de composição das áreas empilhadas com preenchimentos suaves que criam transições de cor. Isso melhora o apelo visual e ajuda a perceber como as contribuições de cada série mudam ao longo do tempo.

Quando usar

Mostrar como as partes contribuem para o todo ao longo do tempo
Destacar transições suaves entre diferentes estados de composição
Criar apresentações atraentes de tendências com vários componentes
Representar camadas com ênfase estética

Não é ideal

Quando valores exatos são críticos (o degradê dificulta leituras precisas)
Mais de 5–7 séries (fica confuso)
Categorias sem ordem natural

Variações-chave

Degradês verticais (de baixo para cima em cada faixa)
Degradês horizontais (ao longo da linha do tempo)
Paradas de cor personalizadas por série
Variações de opacidade para criar profundidade

Casos de uso

Evolução de participação de mercado por marca
Mix energético por fonte ao longo dos anos
Mudanças na alocação de orçamento entre departamentos
Composição de fontes de tráfego de sites
Quebra de receita por portfólio de produtos

Dados (CSV)

x,Line 1,Line 2,Line 3,Line 4,Line 5
Mon,140,120,320,220,220
Tue,232,282,132,402,302
Wed,101,111,201,231,181
Thu,264,234,334,134,234
Fri,90,220,190,190,210
Sat,340,340,130,230,290
Sun,250,310,220,120,150

Configuração do Gráfico (JSON)

Dicas de desempenho

Limite a quantidade de séries a no máximo 7 para manter clareza
Use transições suaves nas animações
Considere renderização progressiva em conjuntos muito grandes

Perguntas frequentes

O que difere de uma área empilhada tradicional? Aqui cada faixa usa preenchimento em degradê em vez de cor sólida, criando uma estética moderna e fluida que facilita perceber a continuidade dos dados.

Quantas séries são demais? Acima de 5–7 camadas fica confuso, especialmente com degradê. Agrupe categorias pequenas em “Outros” ou use outra visualização se houver muitas séries.

Devo sempre usar degradê? Não. Use quando:

O apelo visual é prioridade (apresentações, relatórios, dashboards)
Você busca um acabamento moderno e polido
A narrativa se beneficia de fluidez visual
Sua audiência espera visualizações atraentes

Evite quando:

Precisa de leituras numéricas precisas
Trabalha com dados científicos ou análises rigorosas
Sua audiência prefere gráficos tradicionais
Vai imprimir em preto e branco

Curvas suaves ou ângulos marcados?

Curvas suaves (smooth: true): ideais para dados contínuos (vendas, temperatura) e combinam muito bem com degradês.
Ângulos marcados (smooth: false): melhores para dados discretos ou quando deseja enfatizar pontos exatos.

Na maioria dos casos com degradê, curvas suaves reforçam o efeito fluido.

Como escolher boas cores?

Garanta contraste suficiente entre faixas adjacentes
Use paletas harmônicas (análogas funcionam bem)
Respeite o significado de cor no seu domínio (azul para água, verde para crescimento)
Ajuste opacidade: degradês mais claros funcionam melhor quando empilhados
Evite combinações problemáticas para daltonismo (não misture vermelho-verde)
Limite a 5–6 cores distintas

Qual a melhor forma de ler valores? Gráficos de área empilhada são melhores para entender:

Tendência do total (borda superior)
Proporções relativas (espessura de cada faixa)
Mudanças na composição ao longo do tempo

São menos eficazes para comparar valores exatos das faixas intermediárias; use tooltips ou gráficos alternativos se isso for crucial.

Posso destacar uma série específica? Sim. Experimente:

Cores mais brilhantes ou saturadas
Maior opacidade na série em foco
Colocar a série-chave na parte inferior
Usar contraste de cor para guiar a atenção

Diferença entre área empilhada e stream graph? A área empilhada parte do zero e preserva valores absolutos e o total. Stream graphs centralizam os dados em torno de um eixo médio, priorizando o padrão fluido mas perdendo a referência absoluta. Use área empilhada quando os totais importam; use stream graph quando busca apenas ritmo visual.

Example

Guide