3.7 KB177 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>Requirements 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 </style>
14 </head>
15
16 <body>
17 <h1>Requirement diagram demos</h1>
18 <pre class="mermaid">
19 requirementDiagram
20 accTitle: Requirements demo in black and white
21 accDescr: A series of requirement boxes showing relationships among them. Has meaningless task names
22
23 requirement test_req {
24 id: 1
25 text: the test text.
26 risk: high
27 verifymethod: test
28 }
29
30 functionalRequirement test_req2 {
31 id: 1.1
32 text: the second test text.
33 risk: low
34 verifymethod: inspection
35 }
36
37 performanceRequirement test_req3 {
38 id: 1.2
39 text: the third test text.
40 risk: medium
41 verifymethod: demonstration
42 }
43
44 interfaceRequirement test_req4 {
45 id: 1.2.1
46 text: the fourth test text.
47 risk: medium
48 verifymethod: analysis
49 }
50
51 physicalRequirement test_req5 {
52 id: 1.2.2
53 text: the fifth test text.
54 risk: medium
55 verifymethod: analysis
56 }
57
58 designConstraint test_req6 {
59 id: 1.2.3
60 text: the sixth test text.
61 risk: medium
62 verifymethod: analysis
63 }
64
65 element test_entity {
66 type: simulation
67 }
68
69 element test_entity2 {
70 type: word doc
71 docRef: reqs/test_entity
72 }
73
74 element test_entity3 {
75 type: "test suite"
76 docRef: github.com/all_the_tests
77 }
78
79
80 test_entity - satisfies -> test_req2
81 test_req - traces -> test_req2
82 test_req - contains -> test_req3
83 test_req3 - contains -> test_req4
84 test_req4 - derives -> test_req5
85 test_req5 - refines -> test_req6
86 test_entity3 - verifies -> test_req5
87 test_req <- copies - test_entity2
88 </pre
89 >
90 <hr />
91
92 <pre class="mermaid">
93 requirementDiagram
94
95 requirement An Example {
96 id: 1
97 text: the test text.
98 risk: high
99 verifymethod: test
100 }
101
102 functionalRequirement Random Name {
103 id: 1.1
104 text: the second test text.
105 risk: low
106 verifymethod: inspection
107 }
108
109 performanceRequirement Something Else {
110 id: 1.2
111 text: the third test text.
112 risk: medium
113 verifymethod: demonstration
114 }
115
116 interfaceRequirement test_req4 {
117 id: 1.2.1
118 text: the fourth test text.
119 risk: medium
120 verifymethod: analysis
121 }
122
123 physicalRequirement test_req5 {
124 id: 1.2.2
125 text: the fifth test text.
126 risk: medium
127 verifymethod: analysis
128 }
129
130 designConstraint test_req6 {
131 id: 1.2.3
132 text: really long text to test overflow. really long text to test overflow. really long text to test overflow.
133 risk: medium
134 verifymethod: analysis
135 }
136
137 element test_entity {
138 type: simulation
139 }
140
141 element test_entity2 {
142 type: word doc
143 docRef: reqs/test_entity
144 }
145
146 element test_entity3 {
147 type: "test suite"
148 docRef: github.com/all_the_tests
149 }
150
151
152 test_entity - satisfies -> Random Name
153 An Example - traces -> Random Name
154 An Example - contains -> Something Else
155 Something Else - contains -> test_req4
156 test_req4 - derives -> test_req5
157 test_req5 - refines -> test_req6
158 test_entity3 - verifies -> test_req5
159 An Example <- copies - test_entity2
160 </pre>
161
162 <script type="module">
163 import mermaid from './mermaid.esm.mjs';
164 mermaid.initialize({
165 theme: 'neutral',
166 // themeCSS: '.node rect { fill: red; }',
167 logLevel: 3,
168 securityLevel: 'loose',
169 flowchart: { curve: 'basis' },
170 gantt: { axisFormat: '%m/%d/%Y' },
171 sequence: { actorMargin: 50 },
172 // sequenceDiagram: { actorMargin: 300 } // deprecated
173 });
174 </script>
175 </body>
176</html>
177