Remover o título
- Entrada
- pie
- Saída esperada
- gráfico sem cabeçalho
A palavra-chave title é opcional; sem ela o gráfico é desenhado sem cabeçalho, só com a legenda das fatias.
Carregando ferramenta… / Loading tool…
gráfico de pizza mermaid
A sintaxe pie do Mermaid é a mais curta entre os tipos de diagrama: um título opcional e uma lista de "rótulo" : valor. Este preset já carrega um exemplo de distribuição de orçamento entre quatro categorias.
A palavra-chave title é opcional; sem ela o gráfico é desenhado sem cabeçalho, só com a legenda das fatias.
A diretiva showData na primeira linha adiciona o valor numérico de cada fatia ao lado do percentual na legenda.
Com 13 fatias ou mais, a paleta de 12 cores reinicia do começo, então a 13ª fatia usa a mesma cor da 1ª; para manter todas distintas, é preciso limitar o gráfico a 12 categorias.
Mermaid é uma biblioteca JavaScript de código aberto que transforma texto simples, escrito em uma sintaxe própria parecida com Markdown, em diagramas renderizados como SVG. Em vez de desenhar caixas e setas manualmente em uma ferramenta gráfica, você descreve a estrutura do diagrama em algumas linhas de texto e a biblioteca calcula o layout e desenha o resultado.
Não. O Mermaid calcula o percentual de cada fatia automaticamente com base na soma de todos os valores informados, então eles podem ser números absolutos, como reais gastos ou unidades vendidas.
Sim, a sintaxe do Mermaid exige aspas duplas ao redor do rótulo mesmo quando ele é uma única palavra sem espaço, como "Outros" : 10; sem as aspas o parser rejeita a linha.
Sim, valores como 12.5 são aceitos normalmente, o que é útil para percentuais já calculados ou métricas fracionárias.
Carregando o motor de renderização...
O código Mermaid e o diagrama renderizado ficam só no seu navegador, processados pela biblioteca mermaid.js. Nada é enviado a servidores.