mxGraph
Bibliothèque de diagrammes JavaScript open source
Générez des applications graphiques et graphiques interactives via la bibliothèque de diagrammes JavaScript gratuite Open Source.
mxGraph est une bibliothèque de création de diagrammes JavaScript open source qui fournit des fonctionnalités pour le rendu de diagrammes SVG et HTML. Aucun logiciel tiers n'est requis pour utiliser la bibliothèque mxGraph. L'autre avantage est qu'il ne nécessite aucun plugin et peut être intégré dans pratiquement n'importe quel framework. mxGraph fournit des fonctionnalités destinées à afficher des diagrammes et des graphiques interactifs. L'API fournit toutes les fonctionnalités couramment requises pour dessiner, interagir et associer un contexte à un diagramme.
L'API utilise une architecture très courante, elle nécessite un serveur Web ayant la capacité de gérer des pages HTML et un navigateur Web qui supporte JavaScript. Il utilise principalement un fichier JavaScript qui contient toutes les fonctionnalités de la bibliothèque. Ce fichier est chargé dans une page Web HTML dans une section JavaScript et s'exécute dans un conteneur HTML dans le navigateur.
En bref
Un aperçu des fonctionnalités de mxGraph.
- Générer un diagramme
- Modifier le diagramme
- Afficher des graphiques.
- Prise en charge de la grille
- Prise en charge de la forme
- Prise en charge des étiquettes
- Diagramme de styles
- Utilisation des calques
- Diagramme de fusion
- Prise en charge de la barre de défilement
mxGraph prend en charge le format de feuille de calcul Excel et peut exporter des données vers des formats de fichiers courants.
Indépendance de la plate-forme
mxGraph ne nécessite que JavaScript.
- Python 2.6 et supérieur
Premiers pas avec mxGraph
La méthode recommandée pour installer mxGraph est via npm, il est disponible via le gestionnaire de packages npm. Pour utiliser mxGraph comme dépendance, utilisez npm install.
Installer mxGraph via npm
npm install mxgraph --saveGénérer des graphiques via l'API JavaScript
La bibliothèque open source mxGraph fournit des fonctionnalités pour créer un diagramme ou des graphiques à l'aide de JavaScript. Il prend également en charge la modification de graphiques complexes en créant de nouveaux éditeurs de graphiques ou en les personnalisant. Tout d'abord, vous devez créer un graphique à l'intérieur du conteneur donné, puis vous pouvez facilement ajouter des cellules au modèle pour créer le graphique. Vous pouvez facilement ajouter des titres de diagramme et placer des notes sur plusieurs participants. La bibliothèque fournit également des fonctionnalités supplémentaires telles que des effets visuels, le contrôle de l'interface utilisateur, etc.
Fusionner deux graphiques via JavaScript
mxGraph permet aux programmeurs informatiques de fusionner deux graphiques dans leurs propres applications JavaScript. Tout d'abord, vous devez créer un exemple de graphique à l'intérieur du conteneur donné. Veuillez arrondir toutes les cellules avec une étiquette blanche en gras. Veuillez maintenant créer le deuxième modèle de graphique sans conteneur. Ajoutez des cellules au modèle cible en une seule étape à l'aide d'identifiants personnalisés pour les sommets. Vous pouvez maintenant fusionner le modèle du deuxième graphique dans le modèle du premier graphique.
Grille de dessin à l'aide de JavaScript
La bibliothèque mxGraph permet aux développeurs de logiciels de dessiner une grille dynamiquement dans leurs propres applications JavaScript. Vous pouvez facilement dessiner une grille de manière dynamique à l'aide du canevas HTML 5. Veuillez d'abord créer le graphique à l'intérieur du conteneur donné et créer dynamiquement une grille qui nécessite un canevas. Vous devez modifier le filtrage des événements pour accepter le canevas en tant que conteneur. Cefface maintenant l'arrière-plan si nécessaire et définit la distance des lignes de la grille en pixels. Dessine maintenant la grille réelle.
