Nous sommes ravis d’annoncer le lancement officiel de Visual Paradigm VPasCode, la toute nouvelle plateforme unifiée de Visual Paradigm diagramme en tant que code plateforme. Que vous soyez ingénieur logiciel, architecte système ou analyste d’affaires, VPasCode est conçu pour rationaliser votre flux de travail en transformant du texte en diagrammes beaux et professionnels en quelques secondes.
Dites adieu aux changements de contexte entre différents outils. VPasCode rassemble vos langages de texte vers diagramme open-source préférés dans un seul environnement web unifié, fluide et puissant.
Qu’est-ce que VPasCode ?
VPasCode (Visual Paradigm as Code) est un environnement intégré qui combine un éditeur de code pratique et gratuit éditeur de code avec un moteur de rendu de diagrammes. Si vous aimez la rapidité et les avantages du contrôle de version lors de l’écriture de vos diagrammes, VPasCode vous offre le bac à sable ultime pour les créer, les prévisualiser et les partager instantanément.
Étant donné qu’il s’agit d’un environnement entièrement intégré, VPasCode prend théoriquement en charge toutes les règles de syntaxe des moteurs de diagrammation les plus populaires au monde. Au lancement, nous prenons en charge intégralement :
- Éditeur et moteur de rendu PlantUML : Créez des diagrammes d’architecture d’entreprise et de logiciels robustes.
- Éditeur et moteur de rendu Mermaid.js : Rendu natif dans votre navigateur de graphiques et de chronologies modernes inspirés du Markdown.
- Éditeur et moteur de rendu Graphviz : Profitez de la puissance du langage DOT pour les réseaux complexes et les structures de données.
…et ce n’est que le début ! Nous continuerons d’ajouter de nouveaux formats de texte vers diagramme à l’avenir.
Types de diagrammes pris en charge en un coup d’œil
VPasCode prend en charge une bibliothèque incroyablement vaste de types de diagrammes. Voici un aperçu de ce que vous pouvez créer dès maintenant :
Intégration PlantUML
- Diagrammes de séquence, de cas d’utilisation, de classes et d’objets
- Diagrammes d’activité, de composants, de déploiement et d’états
- Modèles ArchiMate et C4
- Diagrammes de relations d’entités (ERD) & ERD de Chen
- Diagrammes de réseaux, WBS (Work Breakdown Structure) et diagrammes temporels
Intégration de Mermaid.js
- Diagrammes de flux, de classes et de séquence
- Diagrammes de relations d’entités (ERD) & diagrammes d’états
- Cartes mentales, chronologies et cartes de parcours utilisateur
- Diagrammes de Gantt, graphiques Git et tableaux Kanban
- Modèles C4, diagrammes en quadrants et diagrammes de besoins
Intégration de Graphviz
- Digraphe & graphe
- Diagrammes de flux & diagrammes de flux de données
- Organigrammes & clusters
Fonctionnalités & capacités
Nous souhaitons que VPasCode soit accessible à tous, c’est pourquoi nous avons intégré des outils essentiels dans notre offre gratuite tout en proposant des fonctionnalités révolutionnaires assistées par l’IA pour les utilisateurs premium.
Fonctionnalités gratuites accessibles à tous :
- Prise en charge multi-moteur : Accès complet à PlantUML, Mermaid.js et Graphviz.
- Descriptions textuelles : Créez des diagrammes complexes uniquement grâce à un code intuitif.
- Aperçu en temps réel : Voyez votre diagramme se mettre à jour instantanément sur le côté de votre écran pendant que vous tapez.
- Partage facile : Générez une URL unique pour partager facilement votre diagramme en direct avec vos collègues ou clients.
- Exports flexibles : Téléchargez votre travail terminé en haute qualité PNG images ou SVG graphiques vectoriels évolutifs.
Boostez votre flux de travail avec des fonctionnalités payantes :
- Correction automatique des erreurs de code par IA :Bloqué par une erreur de syntaxe ? Notre IA intégrée analysera votre code PlantUML, Mermaid ou Graphviz et corrigera automatiquement les erreurs.
- Traduction par IA:Traduisez sans effort le texte et les libellés de vos diagrammes dans plusieurs langues en un seul clic.
Comment accéder aux fonctionnalités payantes de VPasCode
Si vous êtes déjà utilisateur de Visual Paradigm, vous avez peut-être déjà accès à nos fonctionnalités IA premium !
Les fonctionnalités payantes de VPasCode sont incluses avec :
- Visual Paradigm Online Combo Edition (ou version supérieure).
- Visual Paradigm Desktop Professional Edition (ou version supérieure) avec un contrat de maintenance actif.
Note pour les utilisateurs de la version bureau :Les utilisateurs de Visual Paradigm Professional Edition (ou version supérieure) disposant d’un contrat de maintenance actif bénéficient automatiquement d’un accès complet aux applications web de VP Online Combo Edition, ce qui signifie que vous accédez instantanément aux outils IA premium de VPasCode sans frais supplémentaires !
PlantUML et Mermaid dans VPasCode – Exemples de diagrammes
Diagramme de cas d’utilisation PlantUML : Système de commerce électronique
Ce diagramme de cas d’utilisation illustre les interactions principales au sein d’un système de paiement de commerce électronique. Un client peut consulter son panier et passer au paiement, où l’authentification, l’application de coupons et le paiement par carte de crédit sont intégrés via des services externes tels qu’un fournisseur d’identité et un processeur de paiement.
@startuml
left to right direction
actor "Client E-Commerce" as customer
actor "Fournisseur d'identité" as authPool
actor "Processeur de paiement" as stripe
rectangle "Limite du système de paiement" {
usecase "Authentifier" as UC_Auth
usecase "Voir le panier" as UC_Cart
usecase "Payer" as UC_Check
usecase "Appliquer un coupon" as UC_Promo
usecase "Payer par carte de crédit" as UC_Pay
}
customer --> UC_Cart
customer --> UC_Check
UC_Check ..> UC_Auth : <>
UC_Check <.. UC_Promo : <>
UC_Check ..> UC_Pay : <>
UC_Auth --> authPool
UC_Pay --> stripe
@enduml
Diagramme de classes PlantUML : Système de gestion de bibliothèque
Ce diagramme de classes modélise un système de gestion de bibliothèque, montrant les entités clés impliquées dans la gestion du catalogue, les services aux membres et les opérations d’emprunt. La conception utilise l’héritage pour représenter différents types de documents de bibliothèque (tels que livres, magazines et DVD), tandis que les associations entre les membres, les bibliothécaires, les registres d’emprunt et les amendes illustrent comment les documents sont empruntés, rendus et gérés tout au long de leur cycle de vie.
@startuml
class Bibliothèque {
- nom: String
- adresse: String
- téléphone: String
+ ajouterMembre(membre: Membre): void
+ supprimerMembre(idMembre: String): void
+ ajouterArticle(article: ArticleBibliothèque): void
+ supprimerArticle(idArticle: String): void
+ prêterArticle(idMembre: String, idArticle: String): boolean
+ retournerArticle(idArticle: String): boolean
}
class ArticleBibliothèque {
# idArticle: String
# titre: String
# éditeur: String
# annéePublication: int
# estDisponible: boolean
+ obtenirDétails(): String
+ définirDisponibilité(statut: boolean): void
}
abstract class Livre {
- isbn: String
- auteur: String
- nombrePages: int
+ obtenirAuteur(): String
}
class LivreNumérique {
- tailleFichierMo: double
- format: String
- urlTéléchargement: String
+ télécharger(): void
}
class LivreImprimé {
- emplacementÉtagère: String
- état: String
+ obtenirEmplacementÉtagère(): String
}
class Magazine {
- numéroÉdition: int
- numéroVolume: int
- dateCouverture: Date
}
class DVD {
- duréeMinutes: int
- réalisateur: String
- langue: String
- sous-titresDisponibles: boolean
}
class Membre {
- idMembre: String
- nom: String
- email: String
- téléphone: String
- dateAdhésion: Date
+ emprunterArticle(article: ArticleBibliothèque): boolean
+ retournerArticle(article: ArticleBibliothèque): boolean
+ obtenirArticlesEmpruntés(): List
}
class EnregistrementEmprunt {
- idEnregistrement: String
- dateEmprunt: Date
- dateÉchéance: Date
- dateRetour: Date
- estEnRetard(): boolean
- calculerAmende(): double
}
class Amende {
- idAmende: String
- montant: double
- dateÉmission: Date
- estPayée: boolean
+ payerAmende(): void
}
class Bibliothécaire {
- idEmployé: String
- département: String
+ traiterEmprunt(membre: Membre, article: ArticleBibliothèque): void
+ traiterRetour(article: ArticleBibliothèque): void
+ générerRapport(): void
+ gérerInventaire(): void
}
' Relations d'héritage
ArticleBibliothèque <|-- Livre
ArticleBibliothèque <|-- Magazine
ArticleBibliothèque <|-- DVD
Livre <|-- LivreNumérique
Livre <|-- LivreImprimé
' Composition et agrégation
Bibliothèque "1" -- "plusieurs" Membre : possède >
Bibliothèque "1" -- "plusieurs" ArticleBibliothèque : contient >
Bibliothèque "1" -- "plusieurs" Bibliothécaire : emploie >
Membre "1" -- "plusieurs" EnregistrementEmprunt : possède >
EnregistrementEmprunt "1" -- "1..*" ArticleBibliothèque : référence >
EnregistrementEmprunt "1" -- "0..*" Amende : génère >
' Association
Bibliothécaire --> EnregistrementEmprunt : gère >
Membre --> EnregistrementEmprunt : crée >
note top of Bibliothèque : Système central qui gèrenles membres, les articles et les prêts
note right of ArticleBibliothèque : Classe de base abstraitenpour tous les supports de la bibliothèque
@enduml
Diagramme de séquence PlantUML : Retrait d’espèces à un guichet automatique
Ce diagramme de séquence illustre les interactions impliquées dans une transaction de retrait d’espèces à un guichet automatique, de l’insertion de la carte et de la validation du code PIN jusqu’à la distribution d’espèces et la mise à jour du compte. Il met en évidence la communication entre le client, le guichet automatique, le système bancaire et la base de données des comptes clients, tout en modélisant également des flux alternatifs tels que des tentatives de code PIN invalide, un solde insuffisant et l’impression facultative d’un reçu.
@startuml
' Titre
title Retrait d'espèces à un guichet automatique - Diagramme de séquence
' Acteurs et participants
actor Client as C
participant "Guichet automatique" as ATM
participant "Système bancaire" as BS
database "Compte client" as DB
' Séquence
C -> ATM : Insérer la carte
ATM -> ATM : Lire les détails de la carte
ATM -> C : Demander le code PIN
C -> ATM : Entrer le code PIN
ATM -> BS : Valider la carte et le code PIN
BS -> DB : Vérifier les identifiants
DB --> BS : Résultat de la validation
alt Code PIN invalide
BS --> ATM : Code PIN invalide
ATM -> C : Code PIN invalide, réessayez
note right: Après 3 tentatives échouées,nla carte est conservée
else Code PIN valide
BS --> ATM : Code PIN valide
ATM -> C : Afficher le menu principal
C -> ATM : Sélectionner le retrait
ATM -> C : Demander le montant
C -> ATM : Entrer le montant
ATM -> BS : Vérifier le solde et la limite
BS -> DB : Interroger le solde
DB --> BS : Solde actuel
alt Solde insuffisant
BS --> ATM : Solde insuffisant
ATM -> C : Transaction refuséen(Afficher le solde)
C -> ATM : Annuler la transaction
ATM -> C : Rendre la carte
else Solde suffisant
BS --> ATM : Approuvé
ATM -> ATM : Distribuer l'argent
ATM -> C : Distribuer l'argent
C -> ATM : Prendre l'argent
ATM -> BS : Confirmer la distribution d'argent
BS -> DB : Débiter le compte et enregistrer la transaction
DB --> BS : Mise à jour terminée
BS --> ATM : Transaction terminée
ATM -> C : Imprimer le reçu
alt Reçu demandé
C -> ATM : Prendre le reçu
else Pas de reçu
C -> ATM : Refuser le reçu
end
ATM -> C : Rendre la carte
C -> ATM : Prendre la carte
end
end
ATM -> C : Merci / Fin de la transaction
@enduml
Diagramme d’activité PlantUML : Système de gestion des sinistres d’assurance
Ce diagramme d’activité modélise le flux de travail de bout en bout d’un système de traitement des sinistres d’assurance, de la soumission du sinistre jusqu’à la validation, l’enquête et le règlement. Il capture les points de décision clés tels que l’éligibilité de la police, l’exhaustivité des documents, la validité du sinistre et l’acceptation du règlement, tout en illustrant à la fois les chemins de succès et de gestion des exceptions, y compris le rejet du sinistre et la résolution des litiges.
@startuml InsuranceClaimSystem
début
:Le souscripteur soumet une réclamation;
:La réclamation est enregistrée dans le système;
si (La police est-elle active et valide ?) alors (oui)
:Attribuer la réclamation à l'expert;
:Notifier l'expert de la nouvelle réclamation;
sinon (non)
:Envoyer un avis de rejet au souscripteur;
:Enregistrer la raison : Police inactive/invalidée;
stop
finsi
:L'expert examine les documents soumis;
si (Tous les documents requis sont-ils présents ?) alors (oui)
:L'expert initie la validation de la réclamation;
sinon (non)
:Demander les documents manquants au souscripteur;
:Attendre les documents supplémentaires;
:Re-vérifier les documents;
note right
Le système attend
la réponse du souscripteur
end note
-> retour à "L'expert examine les documents soumis";
finsi
:L'expert enquête sur la réclamation;
:Contacter des témoins/experts si nécessaire;
:Estimer le montant des dommages/pertes;
si (La réclamation est-elle valide selon les termes de la police ?) alors (oui)
:Calculer le montant approuvé;
:Appliquer la franchise si applicable;
sinon (non)
:Envoyer un avis de rejet avec la raison;
:Enregistrer la décision dans le système;
stop
finsi
:Générer une offre de règlement;
:Envoyer l'offre de règlement au souscripteur;
:Le souscripteur examine l'offre;
si (Le souscripteur accepte-t-il l'offre ?) alors (oui)
:Traiter le paiement;
:Mettre à jour le statut de la réclamation à "Règlementé";
:Envoyer une confirmation au souscripteur;
:Enregistrer les détails de clôture;
sinon (non)
:Escalader vers la résolution des litiges;
:Négocier le règlement;
:Mettre à jour l'offre;
-> retour à "Envoyer l'offre de règlement au souscripteur";
finsi
stop
@enduml
Diagramme d’état PlantUML : Système de détection de fumée
Ce diagramme d’état illustre le comportement d’un système de détection de fumée lors de ses transitions entre différents états opérationnels tels que la veille, la surveillance, la détection de fumée, l’activation de l’alarme et la gestion des erreurs. Il montre comment le système réagit aux événements tels que les changements d’alimentation, les résultats d’auto-vérification, la détection de fumée, les conditions de batterie faible et les réinitialisations initiées par l’utilisateur, afin d’assurer une surveillance et une alerte incendie fiables.
@startuml SmokeDetectionSystem
title Diagramme d'état - Système de détection de fumée
[*] --> Éteint
state Éteint {
[*] --> PasDeCourant
PasDeCourant : L'appareil est éteint
PasDeCourant --> Allumé : Bouton d'alimentation pressé
}
state Allumé {
[*] --> Veille
Veille : Système prêt
Veille --> AutoVérif : Auto-test périodique (toutes les 24h)
Veille --> Surveillance : Démarrer la surveillance (capteur actif)
state AutoVérif {
[*] --> TestCapteurs
TestCapteurs --> TestOK : Tous les capteurs OK
TestCapteurs --> TestÉchec : Erreur de capteur détectée
TestOK --> Veille : Retour à la veille
TestÉchec --> ÉtatErreur : Signaler l'erreur
}
state Surveillance {
[*] --> PasDeFumée
PasDeFumée : Fonctionnement normal
PasDeFumée --> FuméeDétectée : Niveau de fumée > seuil
PasDeFumée --> BatterieFaible : Batterie faible (sans fil)
BatterieFaible --> PasDeFumée : Batterie remplacée
state FuméeDétectée {
[*] --> AlerteInitiale
AlerteInitiale --> FuméeConfirmée : Fumée persiste > 5 sec
AlerteInitiale --> FauxAlarme : Fumée disparaît < 5 sec FauxAlarme --> PasDeFumée : Réinitialiser
FuméeConfirmée --> AlarmeActive
}
state AlarmeActive {
[*] --> SonnerAlarme : Activer sirène et lumières
SonnerAlarme --> EnvoyerNotification : Notifier le panneau de contrôle / l'application
EnvoyerNotification --> AttendreRéinitialisation
AttendreRéinitialisation --> AlarmeActive : Fumée toujours présente
AttendreRéinitialisation --> RéinitialiserSystème : Bouton de réinitialisation pressé
RéinitialiserSystème --> PasDeFumée : Système réinitialisé
}
}
}
state ÉtatErreur {
[*] --> IndicateurDéfaut : Clignoter la LED d'erreur
IndicateurDéfaut --> Éteint : Cycle d'alimentation manuel requis
}
Allumé --> ÉtatErreur : Échec de l'auto-vérification
ÉtatErreur --> Éteint : Cycle d'alimentation
Éteint --> [*] : Système débranché / batterie retirée
@enduml
Diagramme de composants PlantUML : Système de messagerie
Ce diagramme de composants présente l’architecture de haut niveau d’un système de gestion de messagerie, montrant comment les applications clientes, les services backend, l’infrastructure de messagerie, les caches et les bases de données interagissent pour soutenir les opérations de livraison de colis. Il illustre la séparation des responsabilités entre les services tels que la gestion des commandes, l’expédition, le suivi, les paiements, les notifications et la gestion des utilisateurs, tout en mettant en évidence à la fois la communication API synchrone et le traitement asynchrone basé sur des événements.
@startuml CourierSystem
title Système de messagerie - Diagramme de composants
' === Composants ===
component "Application Client" as CustomerApp
component "Application Mobile du Livreur" as CourierApp
component "Tableau de Bord Web Admin" as AdminWeb
component "Passerelle API" as ApiGateway
component "Service de Commande" as OrderService
component "Service d'Expédition" as DispatchService
component "Service de Suivi" as TrackingService
component "Service de Paiement" as PaymentService
component "Service de Notification" as NotificationService
component "Service Utilisateur" as UserService
component "File d'attente de Messagesn(RabbitMQ/Kafka)" as MessageQueue
component "Cache Redis" as RedisCache
database "Base de données PostgreSQL" as SQLDB
database "MongoDBn(Journaux/Historique de suivi)" as MongoLogs
' === Interfaces / Ports ===
CustomerApp --> ApiGateway : "REST / WebSocket"
CourierApp --> ApiGateway : "REST / WebSocket"
AdminWeb --> ApiGateway : "REST"
ApiGateway --> OrderService
ApiGateway --> TrackingService
ApiGateway --> PaymentService
ApiGateway --> UserService
' === Dépendances de Services ===
OrderService --> DispatchService : "gRPC / REST"
OrderService --> PaymentService
OrderService --> NotificationService
OrderService --> SQLDB : "JDBC"
OrderService --> RedisCache : "Cache"
DispatchService --> MessageQueue : "Publier des événements"
DispatchService --> CourierApp : "Pousser via la passerelle API"
DispatchService --> SQLDB
TrackingService --> MessageQueue : "S'abonner aux mises à jour de localisation"
TrackingService --> MongoLogs : "Écrire l'historique de suivi"
TrackingService --> RedisCache : "Cache de localisation actuelle"
PaymentService --> SQLDB
PaymentService --> NotificationService
NotificationService --> MessageQueue : "Consommer les notifications"
NotificationService --> CustomerApp : "Pousser via la passerelle API"
UserService --> SQLDB
UserService --> RedisCache
' === Notes ===
note right of OrderService
Gère la création de colis,
la tarification et le statut de la commande
end note
note right of DispatchService
Apparie les commandes avec les livreurs,
optimise les itinéraires
end note
note bottom of MessageQueue
Événements asynchrones : commande_créée,
localisation_mise_à_jour,
statut_livraison_modifié
end note
@enduml
Diagramme de déploiement PlantUML : Architecture d’exemple
@startuml
node "AWS Cloud Route53" as DNS
node "VPC (10.0.0.0/16)" {
node "Sous-réseau Public" {
artifact "Équilibreur de charge NGINX" as ALB
}
node "Cluster de sous-réseau privé" {
node "Instance EC2 1" {
component "API Node.js [Pod 1]" as Pod1
}
node "Instance EC2 2" {
component "API Node.js [Pod 2]" as Pod2
}
}
node "Sous-réseau de base de données" {
database "Amazon RDS (Aurora Multi-AZ)" as Aurora
}
}
DNS --> ALB : Résout le trafic
ALB --> Pod1 : Équilibrage round-robin
ALB --> Pod2
Pod1 --> Aurora : Pool de connexions
Pod2 --> Aurora
@enduml
Exemple ArchiMate PlantUML : Navigateur Internet
Ce diagramme ArchiMate illustre comment les couches métier, application et technologie interagissent pour soutenir les fonctionnalités métier basées sur le Web via un navigateur Internet. Il démontre les relations entre les processus métier, les composants et données de pages Web générés dynamiquement, les services et plugins du navigateur, et l’infrastructure de serveur Web sous-jacente qui fournit et soutient l’expérience de l’application.
@startuml Exemple Navigateur Internet
!include <archimate/Archimate>
title Exemple ArchiMate - Navigateur Internet
'LAYOUT_AS_SKETCH()
'LAYOUT_LEFT_RIGHT()
'LAYOUT_TOP_DOWN()
Grouping(business, "Métier"){
Business_Object(businessObject, "Un Objet Métier")
Business_Process(someBusinessProcess,"Un Processus Métier")
Business_Service(itSupportService, "Support IT pour le Métier (Service Application)")
}
Grouping(application, "Application"){
Application_DataObject(dataObject, "Données de Page Web n 'à la volée'")
Application_Function(webpageBehaviour, "Comportement de la page Web")
Application_Component(ActivePartWebPage, "Partie Active de la page Web n 'à la volée'")
}
Grouping(technology, "Technologie"){
Technology_Artifact(inMemoryItem,"en mémoire / 'à la volée' html/javascript")
Technology_Service(internetBrowser, "Navigateur Internet Générique & Plugin")
Technology_Service(internetBrowserPlugin, "Certains Plugins de Navigateur Internet")
Technology_Service(webServer, "Certains Serveurs Web")
}
Rel_Flow_Left(someBusinessProcess, businessObject, "")
Rel_Serving_Up(itSupportService, someBusinessProcess, "")
Rel_Specialization_Up(webpageBehaviour, itSupportService, "")
Rel_Flow_Right(dataObject, webpageBehaviour, "")
Rel_Specialization_Up(dataObject, businessObject, "")
Rel_Assignment_Left(ActivePartWebPage, webpageBehaviour, "")
Rel_Specialization_Up(inMemoryItem, dataObject, "")
Rel_Realization_Up(inMemoryItem, ActivePartWebPage, "")
Rel_Specialization_Right(inMemoryItem,internetBrowser, "")
Rel_Serving_Up(internetBrowser, webpageBehaviour, "")
Rel_Serving_Up(internetBrowserPlugin, webpageBehaviour, "")
Rel_Aggregation_Right(internetBrowser, internetBrowserPlugin, "")
Rel_Access_Up(webServer, inMemoryItem, "")
Rel_Serving_Up(webServer, internetBrowser, "")
@enduml
Exemple de MCD PlantUML : Système de Billetterie Cinéma
@startuml
entité "Client" as client {
* client_id : UUID <>
--
* prénom : VARCHAR(50)
* nom : VARCHAR(50)
* email : VARCHAR(100) <>
* téléphone : VARCHAR(20)
* points_fidélité : INT
* date_inscription : TIMESTAMP
}
entité "Film" as film {
* film_id : UUID <>
--
* titre : VARCHAR(200)
* description : TEXT
* durée_minutes : INT
* genre : VARCHAR(50)
* date_sortie : DATE
* note : VARCHAR(10)
}
entité "Cinéma" as cinéma {
* cinéma_id : UUID <>
--
* nom_cinéma : VARCHAR(100)
* nombre_total_places : INT
* disposition_places : JSON
}
entité "Spectacle" as spectacle {
* spectacle_id : UUID <>
--
* film_id : UUID <>
* cinéma_id : UUID <>
* heure_spectacle : TIMESTAMP
* heure_fin : TIMESTAMP
* langue : VARCHAR(50)
* sous-titré : BOOLEAN
* prix_régulier : DECIMAL(10,2)
* prix_vip : DECIMAL(10,2)
}
entité "Place" as place {
* place_id : UUID <>
--
* cinéma_id : UUID <>
* étiquette_rang : CHAR(2)
* numéro_place : INT
* type_place : VARCHAR(20)
* est_accessible : BOOLEAN
}
entité "Réservation" as réservation {
* réservation_id : UUID <>
--
* client_id : UUID <>
* spectacle_id : UUID <>
* heure_réservation : TIMESTAMP
* montant_total : DECIMAL(10,2)
* statut : VARCHAR(20)
* mode_paiement : VARCHAR(30)
* identifiant_transaction : VARCHAR(100)
}
entité "PlaceRéservée" as place_réservée {
* réservation_id : UUID <<FK,PK>>
* place_id : UUID <<FK,PK>>
--
* prix_billet : DECIMAL(10,2)
* réduction_appliquée : DECIMAL(10,2)
}
entité "Paiement" as paiement {
* paiement_id : UUID <>
--
* réservation_id : UUID <>
* montant : DECIMAL(10,2)
* date_paiement : TIMESTAMP
* statut_paiement : VARCHAR(20)
* passerelle_paiement : VARCHAR(30)
* référence_passerelle : VARCHAR(200)
}
entité "Avis" as avis {
* avis_id : UUID <>
--
* client_id : UUID <>
* film_id : UUID <>
* note : INT
* commentaire : TEXT
* date_avis : TIMESTAMP
}
' Relations
client ||--o{ réservation : "effectue"
film ||--o{ spectacle : "planifié comme"
cinéma ||--o{ spectacle : "accueille"
spectacle ||--o{ réservation : "possède"
réservation ||--|{ place_réservée : "contient"
place ||--o{ place_réservée : "attribuée à"
réservation ||--|| paiement : "possède"
client ||--o{ avis : "rédige"
film ||--o{ avis : "reçoit"
note right of réservation : Statut : EN_ATTENTE, CONFIRMÉ, ANNULÉ, EXPIRÉ
note left of place : type_place : RÉGULIER, VIP, COUPLE
note right of paiement : statut_paiement : EN_ATTENTE, RÉUSSI, ÉCHOUÉ, REMBOURSÉ
@enduml
Diagramme de flux Mermaid : Consulter un médecin
Ce diagramme de flux illustre un processus décisionnel typique dans le domaine de la santé, guidant les patients de la reconnaissance initiale des symptômes jusqu’au diagnostic, aux tests, au traitement et à la récupération. Il met en évidence les points de décision clés, notamment l’évaluation d’urgence, l’évaluation diagnostique et l’efficacité du traitement, tout en montrant comment des symptômes non résolus peuvent nécessiter une consultation médicale supplémentaire et une réévaluation.
flowchart TD
A[Se sentir malade ou avoir besoin de conseils médicaux] --> B{Est-ce une urgence?}
B -->|Oui| C[Appeler les services d'urgence ou aller aux urgences]
B -->|Non| D[Prendre rendez-vous avec un médecin]
D --> E[Assister au rendez-vous]
E --> F[Évaluation par le médecin]
F --> G{Diagnostic établi?}
G -->|Oui| H[Plan de traitement]
G -->|Non| I[Commander des tests]
I --> J[Recevoir les résultats des tests]
J --> F
H --> K[Suivre le traitement]
K --> L{Les symptômes se sont-ils améliorés?}
L -->|Oui| M[Récupération / Suivi de routine]
L -->|Non| N[Retourner voir le médecin]
N --> F
Graphe Graphviz
Ce diagramme représente une topologie de réseau de centre de données simplifiée, illustrant comment les hôtes sont connectés via un réseau principal de commutateurs interconnectés. Il met en évidence les principaux chemins de communication entre les appareils réseau, y compris une liaison tronc entre les commutateurs et une connexion de basculement secondaire qui assure la redondance et la résilience en cas de perturbation du réseau.
graph UndirectedSpanningTree {
fontname="Helvetica,Arial,sans-serif"
label="Infrastructure de réseau maillé de centre de données"
labelloc="b"
fontsize=14
node [fontname="Helvetica,Arial,sans-serif", shape=circle, style=filled, color="#475569", fillcolor="#f1f5f9", width=0.8, fixedsize=true]
edge [color="#94a3b8", penwidth=2.5]
SwitchAlpha [label="SW_A", fillcolor="#cbd5e1"]
SwitchBeta [label="SW_B", fillcolor="#cbd5e1"]
Node1 [label="Host_01"]
Node2 [label="Host_02"]
Node3 [label="Host_03"]
Node4 [label="Host_04"]
SwitchAlpha -- SwitchBeta [label=" Liaison tronc", weight=5]
SwitchAlpha -- Node1
SwitchAlpha -- Node2
SwitchBeta -- Node3
SwitchBeta -- Node4
Node1 -- Node2 [style=dashed, color="#cbd5e1", label=" Interconnexion de basculement"]
}
Commencez dès aujourd’hui
Prêt à découvrir la rapidité du diagramme en tant que code ? Que vous ayez besoin d’un éditeur fiable PlantUML, d’un éditeur rapide Mermaid, ou d’un compilateur puissant pour Graphviz, VPasCode est prêt pour vous.
Rendez-vous sur notre plateforme dès maintenant à :
Essayez l’éditeur en temps réel et révolutionnez votre façon de concevoir des logiciels et des systèmes !