Use diagrama como código para gerar um diagrama do Lucidchart usando Mermaid. Assim que você escrever o código Mermaid, é possível gerar automaticamente um diagrama no seu documento da Lucid.
O código Mermaid inserido para gerar um diagrama é compatível apenas com o idioma inglês. Se estiver trabalhando na Lucid em outro idioma, o código precisará ser traduzido para o inglês.
Disponibilidade de planos: Individual, Equipe e Corporativo.
- Disponível em contas FedRAMP.
- Leia o artigo Planos da Lucid para mais informações sobre o que está disponível na sua conta ou o artigo Atualize sua conta da Lucid para instruções sobre como mudar de plano.
Acesse o menu de diagramas como código
Para acessar o menu de diagrama como código no Lucidchart, siga estas etapas:
- Selecione
o ícone "Diagrama como código" na barra de ferramentas principal no lado esquerdo do espaço de trabalho.
Gerar diagrama
Conheça o processo de diagrama como código utilizando um de nossos exemplos para cada tipo suportado de diagrama. Quando estiver pronto, gere um diagrama escrevendo seu próprio código Mermaid.
Observação: se um diagrama não for gerado e aparecer a mensagem "Erro de sintaxe. Verifique a sintaxe." abaixo do editor de diagrama como código, use os números de linha e coluna fornecidos para verificar se o código Mermaid está formatado corretamente e tente novamente.
Use um exemplo fornecido
Para criar um diagrama utilizando os exemplos fornecidos, siga estas etapas a partir do menu de diagrama como código:
- Selecione +Novo diagrama do Mermaid.
- Na parte inferior do editor fornecido, clique em uma das opções de exemplo.
- O código será automaticamente adicionado ao editor para o tipo de exemplo selecionado.
- Edite o código de exemplo conforme necessário.
O diagrama será gerado na tela conforme você adiciona e edita o código.
Criar do zero usando o Mermaid
Para criar um novo diagrama do zero utilizando código Mermaid, siga estas etapas a partir do menu de diagrama como código:
- Selecione +Novo diagrama do Mermaid.
- Digite seu código no editor fornecido.
- Clique em Gerar.
O diagrama será gerado na tela conforme você adiciona e edita o código.
Saiba mais: para instruções sobre como começar com o Mermaid, consulte este Guia do usuário Mermaid da central de suporte do Mermaid. O link fornecido leva você para fora d central de suporte da Lucid e não podemos garantir a precisão do conteúdo.
Editar um diagrama
Um diagrama gerado a partir do código deve ser atualizado abrindo e editando o código. Para fazer isso:
- Abra o editor de código associado usando um dos seguintes métodos:
- Clique no diagrama na tela.
- Navegue até o menu de diagrama como código, role a tela e selecione o diagrama que deseja editar.
- Clique no editor e faça suas alterações.
- Conforme você edita, o diagrama na tela é atualizado em tempo real.
O diagrama será atualizado na tela.
Tipos de diagrama suportados
Os seguintes tipos de diagramas são suportados usando o código Mermaid:
- Classe: Mapeia a estrutura de um sistema específico, modelando suas classes, atributos, operações e os relacionamentos entre os objetos.
- C4: aproveita os quatro níveis de modelos (contexto, caixas, componentes e código) conforme o público.
- Entidades e Relacionamentos: representa visualmente um banco de dados para mostrar os relacionamentos entre campos.
- Fluxograma: cria fluxogramas fáceis de seguir que abrangem sistemas e processos complexos.
- Gantt: Represente visualmente o cronograma e o progresso ao gerenciar um projeto.
- Ishikawa: crie diagramas de Ishikawa para mapear visualmente relações de causa e efeito durante a análise da causa raiz.
- Treemap aninhado: visualize estruturas de dados hierárquicas usando retângulos aninhados.
- Gráfico de radar: crie um gráfico para comparar várias variáveis quantitativas em uma grade radial.
- Sequência: representa os processos e objetos que coexistem e as mensagens trocadas entre eles para executar uma função, antes do término da linha de vida.
- Estado: cria um diagrama comportamental para mostrar transições entre vários objetos.
- Gráfico XY: crie gráficos abrangentes de linha, barra ou dispersão para visualizar as relações entre pontos de dados.
Saiba mais: Para saber mais sobre a sintaxe Mermaid e como usar os diagramas suportados no Lucidchart, confira esta publicação da Comunidade da Lucid.
Perguntas frequentes
Qual versão do Mermaid é compatível com o Lucidchart?
O Lucidchart é otimizado para a versão 11.14 do Mermaid.
Envie seu feedback sobre este artigo
Gostaria de compartilhar sua opinião sobre este artigo? Conte-nos sobre sua experiência aqui.