4.6 KB188 lines
Blame
1<!doctype html>
2<html lang="en">
3 <head>
4 <meta charset="utf-8" />
5 <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6 <title>ER diagram | Mermaid Quick Test Page</title>
7 <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
8 <style>
9 div.mermaid {
10 /* font-family: 'trebuchet ms', verdana, arial; */
11 font-family: 'Courier New', Courier, monospace !important;
12 }
13 .diagram-title {
14 fill: red;
15 font-size: 24pt;
16 }
17 </style>
18 </head>
19
20 <body>
21 <pre class="mermaid">
22 ---
23 title: This is a title
24 config:
25 theme: forest
26 ---
27 erDiagram
28 %% title This is a title
29 %% accDescription Test a description
30
31 "Person . CUSTOMER"||--o{ ORDER : places
32
33 ORDER ||--|{ "€£LINE_ITEM ¥" : contains
34
35 "Person . CUSTOMER" }|..|{ "Address//StreetAddress::[DELIVERY ADDRESS]" : uses
36
37 "Address//StreetAddress::[DELIVERY ADDRESS]" {
38 int customerID FK
39 string line1 "this is the first address line comment"
40 string line2
41 string city
42 string region
43 string state
44 string(5) postal_code
45 string country
46 }
47
48 "a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" {
49 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"
50 }
51
52 "€£LINE_ITEM ¥" {
53 int orderID FK
54 int currencyId FK
55 number price
56 number quantity
57 number adjustment
58 number final_price
59 }
60 </pre>
61 <hr />
62
63 <pre class="mermaid">
64 erDiagram
65 "HOSPITAL" {
66 int id PK
67 int doctor_id FK
68 string address UK
69 string name
70 string phone_number
71 string fax_number
72 }
73 </pre>
74 <hr />
75
76 <pre class="mermaid">
77 erDiagram
78 "HOSPITAL" {
79 int id PK
80 int doctor_id PK, FK
81 string address UK
82 string name
83 string phone_number
84 string fax_number
85 }
86 </pre
87 >
88 <hr />
89
90 <pre class="mermaid">
91 erDiagram
92 CAR ||--o{ NAMED-DRIVER : allows
93 CAR {
94 string registrationNumber PK
95 string make
96 string model
97 string[] parts
98 }
99 PERSON ||--o{ NAMED-DRIVER : is
100 PERSON {
101 string driversLicense PK "The license #"
102 string(99) firstName "Only 99 characters are allowed"
103 string lastName
104 string phone UK
105 int age
106 }
107 NAMED-DRIVER {
108 string carRegistrationNumber PK, FK
109 string driverLicence PK,FK
110 }
111 MANUFACTURER only one to zero or more CAR : makes
112 </pre>
113 <hr />
114
115 <pre class="mermaid">
116 erDiagram
117 p[Person] {
118 string firstName
119 string lastName
120 }
121 a["Customer Account"] {
122 string email
123 }
124 p ||--o| a : has
125 </pre>
126 <hr />
127
128 <pre class="mermaid">
129 erDiagram
130 p[Person] {
131 string firstName
132 string lastName
133 }
134 a["Customer Account"] {
135 string email
136 }
137
138 b["Customer Account Secondary"] {
139 string email
140 }
141
142 c["Customer Account Tertiary"] {
143 string email
144 }
145
146 d["Customer Account Nth"] {
147 string email
148 }
149
150 p ||--o| a : "has<br />one"
151 p ||--o| b : "has<br />one<br />two"
152 p ||--o| c : "has<br />one<br />two<br />three"
153 p ||--o| d : "has<br />one<br />two<br />three<br />...<br />Nth"
154 </pre>
155 <hr />
156
157 <pre class="mermaid">
158 erDiagram
159 _customer_order {
160 bigint id PK
161 bigint customer_id FK
162 text shipping_address
163 text delivery_method
164 timestamp_with_time_zone ordered_at
165 numeric total_tax_amount
166 numeric total_price
167 text payment_method
168 }
169 </pre>
170 <hr />
171
172 <script type="module">
173 import mermaid from './mermaid.esm.mjs';
174 mermaid.initialize({
175 theme: 'default',
176
177 // themeCSS: '.node rect { fill: red; }',
178 logLevel: 3,
179 securityLevel: 'loose',
180 flowchart: { curve: 'basis' },
181 gantt: { axisFormat: '%m/%d/%Y' },
182 sequence: { actorMargin: 50 },
183 // sequenceDiagram: { actorMargin: 300 } // deprecated
184 });
185 </script>
186 </body>
187</html>
188