mxGraph
Biblioteca de diagramação JavaScript de código aberto
Gere aplicativos interativos de gráficos e gráficos por meio da biblioteca de diagramação JavaScript gratuita de código aberto.
mxGraph é uma biblioteca de diagramação JavaScript de código aberto que fornece funcionalidade para renderizar diagramas SVG e HTML. Nenhum software de terceiros é necessário para usar a biblioteca mxGraph. A outra coisa boa é que não requer plugins e pode ser integrado a praticamente qualquer framework. O mxGraph fornece recursos destinados a exibir diagramas e gráficos interativos. A API fornece todas as funcionalidades normalmente necessárias para desenhar, interagir e associar um contexto a um diagrama.
A API usa uma arquitetura muito comum, requer um servidor web com capacidade para lidar com páginas HTML e um navegador web que suporte JavaScript. Ele usa principalmente um arquivo JavaScript que contém todas as funcionalidades da biblioteca. Esse arquivo é carregado em uma página da Web HTML em uma seção JavaScript e é executado em um contêiner HTML no navegador
Num relance
Uma visão geral dos recursos do mxGraph.
- Gerar diagrama
- Editar diagrama
- Exibir gráficos.
- Suporte de rede
- Suporte de forma
- Suporte a rótulos
- Diagrama de estilo
- Uso de camadas
- Mesclar diagrama
- Suporte à barra de rolagem
O mxGraph é compatível com o formato de planilha do Excel e pode exportar dados para formatos de arquivo comuns.
Independência da plataforma
mxGraph requer apenas JavaScript.
- Python 2.6 e superior
Introdução ao mxGraph
A maneira recomendada de instalar o mxGraph é via npm, está disponível através do gerenciador de pacotes npm. Para usar mxGraph como uma dependência, use npm install.
Instalar mxGraph via npm
npm install mxgraph --saveGerar gráficos via API JavaScript
A biblioteca mxGraph de código aberto fornece funcionalidade para criar um diagrama ou gráficos usando JavaScript. Ele também suporta a modificação de gráficos complexos criando novos editores de gráficos ou personalizando-os. Primeiro, você precisa criar um gráfico dentro do contêiner fornecido e, em seguida, pode adicionar facilmente células ao modelo para criar o gráfico. Você pode facilmente adicionar títulos de diagramas e colocar notas sobre vários participantes. A biblioteca também fornece recursos adicionais, como efeitos visuais, controle de interface do usuário e muito mais.
Mesclando dois gráficos via JavaScript
O mxGraph permite que os programadores de computador mesclem dois gráficos dentro de seus próprios aplicativos JavaScript. Antes de tudo, você precisa criar um gráfico de amostra dentro do contêiner fornecido. Por favor, arredonda todas as células com uma etiqueta branca em negrito. Agora, crie o segundo modelo de gráfico sem um contêiner. Adicione células ao modelo de destino em uma única etapa usando IDs personalizados para os vértices. Agora você pode mesclar o modelo do segundo gráfico no modelo do primeiro gráfico.
Grade de desenho usando JavaScript
A biblioteca mxGraph permite que os desenvolvedores de software desenhem uma grade dinamicamente dentro de seus próprios aplicativos JavaScript. Você pode facilmente desenhar uma grade dinamicamente usando a tela HTML 5. Primeiro, crie o gráfico dentro do contêiner fornecido e crie uma grade dinamicamente que exija uma tela. Você precisa modificar a filtragem de eventos para aceitar a tela como um contêiner. Agora caprende o plano de fundo, se necessário, e define a distância das linhas de grade em pixels. Agora desenha a grade real.
