🧱Criador de Gráfico de Barras Empilhadas (Composição)
Cada categoria vira uma única barra dividida em segmentos, um por série, com a altura total igual à soma daquele grupo. Ative as porcentagens para ver a participação de cada segmento dentro da barra, consulte a legenda e baixe a imagem em PNG.
A primeira linha é o cabeçalho: o primeiro campo nomeia as categorias e os demais viram as séries da legenda. Aceita vírgula decimal. De 1 a 5 séries e até 12 categorias, todas com valores positivos.
🔒 Cálculo 100% local — os dados que você digita não saem do seu navegador, nada é enviado a servidores.
Fonte: Boas práticas de visualização — barras empilhadas e composição — processamento 100% local no navegador; nenhum dado é enviado · Última verificação em 07/10/2026
O gráfico de barras empilhadas empilha as séries dentro de uma barra por categoria, mostrando ao mesmo tempo o total de cada grupo e a composição desse total. Cole o CSV, ative as porcentagens para ver a participação de cada segmento e baixe o PNG, com processamento local no navegador.
Como usar o criador de barras empilhadas
- Cole as linhas do CSVA primeira linha traz o nome da coluna de categorias e os nomes das séries. Cada linha seguinte é uma categoria, com um valor por série separado por ponto e vírgula.
- Decida entre valor e porcentagemCom a porcentagem ativa, cada segmento mostra sua fatia dentro da barra; desligada, ele mostra o valor absoluto. O total continua escrito acima de cada barra.
- Revise e baixeA legenda ordena as séries de baixo para cima na pilha e a descrição textual lista totais e participações antes do download em PNG.
Como funciona o gráfico
No gráfico de barras empilhadas, cada categoria ocupa uma barra única e os valores das séries são somados na vertical. O primeiro segmento parte da linha do zero, o segundo começa onde o primeiro terminou e assim por diante, de modo que a altura total da barra é a soma da categoria. Isso permite ler duas coisas ao mesmo tempo: a altura da barra, que é o total, e a espessura de cada faixa colorida, que é a contribuição da série.
A ordem das séries na pilha é a mesma da legenda e permanece idêntica em todas as barras, o que mantém a comparação das faixas de um grupo para outro. As porcentagens são calculadas sobre o total da própria barra e só aparecem quando a faixa é alta o bastante para o texto caber. O eixo de valores parte do zero, com passos redondos, e o desenho acontece em um canvas no seu navegador, sem bibliotecas, com processamento 100% local e nada enviado a servidores.
porcentagem do segmento = valor ÷ total da categoria × 100
altura da barra = total da categoria
Exemplo resolvido: composição por cidade
O exemplo usa as mesmas três canais e quatro cidades do comparativo lateral: São Paulo soma 1.450 unidades, com 33,1% na loja física, 42,8% no site e 24,1% no marketplace; Rio de Janeiro soma 1.230, com 31,7%, 43,9% e 24,4%; Belo Horizonte soma 990, com 31,3%, 42,4% e 26,3%; Curitiba soma 850, com 30,6%, 44,7% e 24,7%.
O total geral é 4.520 unidades, e as alturas das barras deixam a hierarquia das cidades imediata: São Paulo é 71% maior que Curitiba. Já a composição é surpreendentemente estável — a faixa do site varia de 42,4% a 44,7% entre as quatro cidades e a da loja física fica sempre entre 30,6% e 33,1%. Somando as séries em todos os grupos, o site responde por cerca de 43% do volume, a loja física por 31,9% e o marketplace por 24,8%, e esse é justamente o tipo de leitura que a barra empilhada entrega de relance.
Suposições e limitações
- Todos os valores precisam ser positivos ou zero; a empilação não faz sentido com números negativos.
- Aceita de 1 a 5 séries e até 12 categorias, com a mesma ordem de séries em todas as barras.
- Comparar segmentos internos é difícil quando as faixas não começam na mesma altura; nesse caso as barras agrupadas são melhores.
- Com categorias de tamanhos muito diferentes, a porcentagem esconde a diferença de escala entre os totais.
- O processamento é 100% local; nada sai do navegador.
Dicas para tirar o melhor proveito
Empilhe quando a pergunta for de composição e o total importar tanto quanto as partes. Mantenha as séries em ordem lógica, por exemplo da maior para a menor média, e preserve essa ordem em todas as barras e em todas as versões do relatório. Se uma série for o foco, deixe-a na base, encostada no eixo, porque é ali que a comparação de altura é mais precisa.
Ative as porcentagens quando as categorias tiverem totais parecidos e o interesse for a proporção; desligue-as quando os totais variarem muito e o valor absoluto for o que importa. Reduza o número de séries antes de reduzir a legibilidade: três séries em quatro barras são confortáveis, seis séries viram umas tiras finas quase impossíveis de ler. Use a descrição textual como resumo acessível e cite os totais no corpo do texto.
Erros comuns a evitar
O erro mais frequente é comparar segmentos do meio das pilhas. Como a faixa central não começa no zero, uma diferença de altura ali não representa diretamente a diferença entre os valores; para isso existem as barras agrupadas. Outro problema é empilhar séries que não compõem o mesmo todo, como valores em unidades diferentes, o que produz barras altas sem significado.
Também é comum trocar a ordem das cores entre duas versões do gráfico, o que obriga o leitor a reconstruir a legenda. E cuidado com as porcentagens arredondadas: elas podem somar 99% ou 101% por causa do arredondamento, e isso é normal. Por fim, não use a barra empilhada para comparar a evolução de muitos períodos; com mais de seis ou sete barras, prefira o gráfico de áreas ou de linhas.
Veja também
Se esta ferramenta foi útil, você também pode precisar destas relacionadas: Criador de gráfico de barras, Criador de gráfico de área, Criador de Gráfico de Barras Agrupadas (Comparativo), Calculadora de porcentagem.
Ferramentas relacionadas
📊Criador de gráfico de barras
Barras verticais ou horizontais com eixo, valores e PNG.
Abrir ferramenta →🏔️Criador de gráfico de área
Gráfico de área empilhado ou sobreposto, com várias séries e PNG.
Abrir ferramenta →📈Criador de Gráfico de Barras Agrupadas (Comparativo)
Várias séries lado a lado por categoria, com legenda e PNG.
Abrir ferramenta →📊Calculadora de porcentagem
Calcule porcentagens, aumentos e descontos em três modos.
Abrir ferramenta →Perguntas frequentes
Qual a diferença entre barras empilhadas e agrupadas?
Empilhadas mostram o total de cada categoria e a composição desse total. Agrupadas colocam as séries lado a lado, o que facilita comparar cada série isoladamente entre as categorias.
Como são calculadas as porcentagens?
Cada valor é dividido pelo total da própria barra e multiplicado por 100. Por isso a soma de uma barra é sempre 100%, antes do arredondamento dos textos.
Posso usar valores negativos?
Não. A empilação pressupõe valores maiores ou iguais a zero. Para mostrar ganhos e perdas em sequência, use o gráfico de cascata.
Quantas séries o gráfico aceita?
Até 5 séries por categoria e até 12 categorias. Acima de 5, as faixas ficam finas e a leitura das porcentagens perde precisão.
Por que a soma das porcentagens deu 101%?
Por causa do arredondamento na exibição. Cada segmento é calculado com precisão total e apenas o texto impresso é arredondado para uma casa decimal.
Os dados ficam em algum servidor?
Não. O CSV é interpretado e a imagem é montada no seu navegador, com processamento 100% local e nenhum envio de dados.
Explore mais ferramentas gratuitas
Dezenas de calculadoras, conversores e geradores — todos funcionam no navegador, sem cadastro e sem instalar nada.