collab/mermaid/demos/er.htmlblame
View source
6dd74de1<!doctype html>
6dd74de2<html lang="en">
6dd74de3 <head>
6dd74de4 <meta charset="utf-8" />
6dd74de5 <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6dd74de6 <title>ER diagram | Mermaid Quick Test Page</title>
6dd74de7 <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
6dd74de8 <style>
6dd74de9 div.mermaid {
6dd74de10 /* font-family: 'trebuchet ms', verdana, arial; */
6dd74de11 font-family: 'Courier New', Courier, monospace !important;
6dd74de12 }
6dd74de13 .diagram-title {
6dd74de14 fill: red;
6dd74de15 font-size: 24pt;
6dd74de16 }
6dd74de17 </style>
6dd74de18 </head>
6dd74de19
6dd74de20 <body>
6dd74de21 <pre class="mermaid">
6dd74de22 ---
6dd74de23 title: This is a title
6dd74de24 config:
6dd74de25 theme: forest
6dd74de26 ---
6dd74de27 erDiagram
6dd74de28 %% title This is a title
6dd74de29 %% accDescription Test a description
6dd74de30
6dd74de31 "Person . CUSTOMER"||--o{ ORDER : places
6dd74de32
6dd74de33 ORDER ||--|{ "€£LINE_ITEM ¥" : contains
6dd74de34
6dd74de35 "Person . CUSTOMER" }|..|{ "Address//StreetAddress::[DELIVERY ADDRESS]" : uses
6dd74de36
6dd74de37 "Address//StreetAddress::[DELIVERY ADDRESS]" {
6dd74de38 int customerID FK
6dd74de39 string line1 "this is the first address line comment"
6dd74de40 string line2
6dd74de41 string city
6dd74de42 string region
6dd74de43 string state
6dd74de44 string(5) postal_code
6dd74de45 string country
6dd74de46 }
6dd74de47
6dd74de48 "a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" {
6dd74de49 string name "this is an entity with an absurd name just to show characters that are now acceptable as long as the name is in double quotes"
6dd74de50 }
6dd74de51
6dd74de52 "€£LINE_ITEM ¥" {
6dd74de53 int orderID FK
6dd74de54 int currencyId FK
6dd74de55 number price
6dd74de56 number quantity
6dd74de57 number adjustment
6dd74de58 number final_price
6dd74de59 }
6dd74de60 </pre>
6dd74de61 <hr />
6dd74de62
6dd74de63 <pre class="mermaid">
6dd74de64 erDiagram
6dd74de65 "HOSPITAL" {
6dd74de66 int id PK
6dd74de67 int doctor_id FK
6dd74de68 string address UK
6dd74de69 string name
6dd74de70 string phone_number
6dd74de71 string fax_number
6dd74de72 }
6dd74de73 </pre>
6dd74de74 <hr />
6dd74de75
6dd74de76 <pre class="mermaid">
6dd74de77 erDiagram
6dd74de78 "HOSPITAL" {
6dd74de79 int id PK
6dd74de80 int doctor_id PK, FK
6dd74de81 string address UK
6dd74de82 string name
6dd74de83 string phone_number
6dd74de84 string fax_number
6dd74de85 }
6dd74de86 </pre
6dd74de87 >
6dd74de88 <hr />
6dd74de89
6dd74de90 <pre class="mermaid">
6dd74de91 erDiagram
6dd74de92 CAR ||--o{ NAMED-DRIVER : allows
6dd74de93 CAR {
6dd74de94 string registrationNumber PK
6dd74de95 string make
6dd74de96 string model
6dd74de97 string[] parts
6dd74de98 }
6dd74de99 PERSON ||--o{ NAMED-DRIVER : is
6dd74de100 PERSON {
6dd74de101 string driversLicense PK "The license #"
6dd74de102 string(99) firstName "Only 99 characters are allowed"
6dd74de103 string lastName
6dd74de104 string phone UK
6dd74de105 int age
6dd74de106 }
6dd74de107 NAMED-DRIVER {
6dd74de108 string carRegistrationNumber PK, FK
6dd74de109 string driverLicence PK,FK
6dd74de110 }
6dd74de111 MANUFACTURER only one to zero or more CAR : makes
6dd74de112 </pre>
6dd74de113 <hr />
6dd74de114
6dd74de115 <pre class="mermaid">
6dd74de116 erDiagram
6dd74de117 p[Person] {
6dd74de118 string firstName
6dd74de119 string lastName
6dd74de120 }
6dd74de121 a["Customer Account"] {
6dd74de122 string email
6dd74de123 }
6dd74de124 p ||--o| a : has
6dd74de125 </pre>
6dd74de126 <hr />
6dd74de127
6dd74de128 <pre class="mermaid">
6dd74de129 erDiagram
6dd74de130 p[Person] {
6dd74de131 string firstName
6dd74de132 string lastName
6dd74de133 }
6dd74de134 a["Customer Account"] {
6dd74de135 string email
6dd74de136 }
6dd74de137
6dd74de138 b["Customer Account Secondary"] {
6dd74de139 string email
6dd74de140 }
6dd74de141
6dd74de142 c["Customer Account Tertiary"] {
6dd74de143 string email
6dd74de144 }
6dd74de145
6dd74de146 d["Customer Account Nth"] {
6dd74de147 string email
6dd74de148 }
6dd74de149
6dd74de150 p ||--o| a : "has<br />one"
6dd74de151 p ||--o| b : "has<br />one<br />two"
6dd74de152 p ||--o| c : "has<br />one<br />two<br />three"
6dd74de153 p ||--o| d : "has<br />one<br />two<br />three<br />...<br />Nth"
6dd74de154 </pre>
6dd74de155 <hr />
6dd74de156
6dd74de157 <pre class="mermaid">
6dd74de158 erDiagram
6dd74de159 _customer_order {
6dd74de160 bigint id PK
6dd74de161 bigint customer_id FK
6dd74de162 text shipping_address
6dd74de163 text delivery_method
6dd74de164 timestamp_with_time_zone ordered_at
6dd74de165 numeric total_tax_amount
6dd74de166 numeric total_price
6dd74de167 text payment_method
6dd74de168 }
6dd74de169 </pre>
6dd74de170 <hr />
6dd74de171
6dd74de172 <script type="module">
6dd74de173 import mermaid from './mermaid.esm.mjs';
6dd74de174 mermaid.initialize({
6dd74de175 theme: 'default',
6dd74de176
6dd74de177 // themeCSS: '.node rect { fill: red; }',
6dd74de178 logLevel: 3,
6dd74de179 securityLevel: 'loose',
6dd74de180 flowchart: { curve: 'basis' },
6dd74de181 gantt: { axisFormat: '%m/%d/%Y' },
6dd74de182 sequence: { actorMargin: 50 },
6dd74de183 // sequenceDiagram: { actorMargin: 300 } // deprecated
6dd74de184 });
6dd74de185 </script>
6dd74de186 </body>
6dd74de187</html>