@groupby/ai-dev 0.5.10 → 0.5.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/package.json +1 -1
  2. package/teams/fhr-neowise/commands/address-pr.md +120 -0
  3. package/teams/fhr-neowise/commands/ready-pr.md +70 -0
  4. package/teams/fhr-neowise/commands/review-pr.md +111 -0
  5. package/teams/fhr-neowise/commands/tdd-implementation.md +86 -0
  6. package/teams/fhr-neowise/commands/write-plan.md +23 -0
  7. package/teams/fhr-neowise/commands/write-pr.md +21 -0
  8. package/teams/fhr-neowise/commands/write-spec.md +25 -0
  9. package/teams/fhr-neowise/skills/agent-routing/SKILL.md +72 -0
  10. package/teams/fhr-neowise/skills/code-review/SKILL.md +83 -0
  11. package/teams/fhr-neowise/skills/code-review/review-template.md +90 -0
  12. package/teams/fhr-neowise/skills/mermaid-diagram/SKILL.md +94 -0
  13. package/teams/fhr-neowise/skills/mermaid-diagram/references/BEST_PRACTICES.md +96 -0
  14. package/teams/fhr-neowise/skills/mermaid-diagram/references/architecture.md +434 -0
  15. package/teams/fhr-neowise/skills/mermaid-diagram/references/block.md +753 -0
  16. package/teams/fhr-neowise/skills/mermaid-diagram/references/c4.md +619 -0
  17. package/teams/fhr-neowise/skills/mermaid-diagram/references/classDiagram.md +1186 -0
  18. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-configuration.md +72 -0
  19. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-directives.md +342 -0
  20. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-layouts.md +40 -0
  21. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-math.md +96 -0
  22. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-theming.md +246 -0
  23. package/teams/fhr-neowise/skills/mermaid-diagram/references/config-tidy-tree.md +89 -0
  24. package/teams/fhr-neowise/skills/mermaid-diagram/references/cynefin.md +279 -0
  25. package/teams/fhr-neowise/skills/mermaid-diagram/references/entityRelationshipDiagram.md +670 -0
  26. package/teams/fhr-neowise/skills/mermaid-diagram/references/eventmodeling.md +475 -0
  27. package/teams/fhr-neowise/skills/mermaid-diagram/references/examples.md +301 -0
  28. package/teams/fhr-neowise/skills/mermaid-diagram/references/flowchart.md +2116 -0
  29. package/teams/fhr-neowise/skills/mermaid-diagram/references/gantt.md +725 -0
  30. package/teams/fhr-neowise/skills/mermaid-diagram/references/gitgraph.md +2138 -0
  31. package/teams/fhr-neowise/skills/mermaid-diagram/references/ishikawa.md +66 -0
  32. package/teams/fhr-neowise/skills/mermaid-diagram/references/kanban.md +161 -0
  33. package/teams/fhr-neowise/skills/mermaid-diagram/references/mindmap.md +335 -0
  34. package/teams/fhr-neowise/skills/mermaid-diagram/references/packet.md +153 -0
  35. package/teams/fhr-neowise/skills/mermaid-diagram/references/pie.md +93 -0
  36. package/teams/fhr-neowise/skills/mermaid-diagram/references/quadrantChart.md +267 -0
  37. package/teams/fhr-neowise/skills/mermaid-diagram/references/radar.md +269 -0
  38. package/teams/fhr-neowise/skills/mermaid-diagram/references/railroad.md +337 -0
  39. package/teams/fhr-neowise/skills/mermaid-diagram/references/requirementDiagram.md +495 -0
  40. package/teams/fhr-neowise/skills/mermaid-diagram/references/sankey.md +415 -0
  41. package/teams/fhr-neowise/skills/mermaid-diagram/references/sequenceDiagram.md +1195 -0
  42. package/teams/fhr-neowise/skills/mermaid-diagram/references/stateDiagram.md +670 -0
  43. package/teams/fhr-neowise/skills/mermaid-diagram/references/timeline.md +571 -0
  44. package/teams/fhr-neowise/skills/mermaid-diagram/references/treeView.md +321 -0
  45. package/teams/fhr-neowise/skills/mermaid-diagram/references/treemap.md +353 -0
  46. package/teams/fhr-neowise/skills/mermaid-diagram/references/userJourney.md +42 -0
  47. package/teams/fhr-neowise/skills/mermaid-diagram/references/venn.md +134 -0
  48. package/teams/fhr-neowise/skills/mermaid-diagram/references/wardley.md +732 -0
  49. package/teams/fhr-neowise/skills/mermaid-diagram/references/xyChart.md +312 -0
  50. package/teams/fhr-neowise/skills/mermaid-diagram/references/zenuml.md +474 -0
  51. package/teams/fhr-neowise/skills/mermaid-diagram/scripts/sync_docs.py +138 -0
  52. package/teams/fhr-neowise/skills/pull-request-authoring/COMPLEX.template.md +52 -0
  53. package/teams/fhr-neowise/skills/pull-request-authoring/NON-CODE.template.md +15 -0
  54. package/teams/fhr-neowise/skills/pull-request-authoring/SIMPLE.template.md +20 -0
  55. package/teams/fhr-neowise/skills/pull-request-authoring/SKILL.md +102 -0
  56. package/teams/fhr-neowise/skills/spec-investigation/SKILL.md +139 -0
  57. package/teams/fhr-neowise/skills/spec-investigation/TEMPLATE.spec.md +74 -0
  58. package/teams/fhr-neowise/skills/tdd-workflow/SKILL.md +137 -0
  59. package/teams/fhr-neowise/skills/write-plan/SKILL.md +285 -0
  60. package/teams/fhr-neowise/skills/write-plan/assets/TEMPLATE.checklist.json +79 -0
  61. package/teams/fhr-neowise/skills/write-plan/assets/TEMPLATE.plan.md +158 -0
@@ -0,0 +1,93 @@
1
+ > **Warning**
2
+ >
3
+ > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
4
+ >
5
+ > ## Please edit the corresponding file in [/packages/mermaid/src/docs/syntax/pie.md](../../packages/mermaid/src/docs/syntax/pie.md).
6
+
7
+ # Pie chart diagrams
8
+
9
+ > A pie chart (or a circle chart) is a circular statistical graphic, which is divided into slices to illustrate numerical proportion. In a pie chart, the arc length of each slice (and consequently its central angle and area), is proportional to the quantity it represents. While it is named for its resemblance to a pie which has been sliced, there are variations on the way it can be presented. The earliest known pie chart is generally credited to William Playfair's Statistical Breviary of 1801
10
+ > -Wikipedia
11
+
12
+ Mermaid can render Pie Chart diagrams.
13
+
14
+ ```mermaid-example
15
+ pie title Pets adopted by volunteers
16
+ "Dogs" : 386
17
+ "Cats" : 85
18
+ "Rats" : 15
19
+ ```
20
+
21
+ ```mermaid
22
+ pie title Pets adopted by volunteers
23
+ "Dogs" : 386
24
+ "Cats" : 85
25
+ "Rats" : 15
26
+ ```
27
+
28
+ ## Syntax
29
+
30
+ Drawing a pie chart is really simple in mermaid.
31
+
32
+ - Start with `pie` keyword to begin the diagram
33
+ - `showData` to render the actual data values after the legend text. This is **_OPTIONAL_**
34
+ - Followed by `title` keyword and its value in string to give a title to the pie-chart. This is **_OPTIONAL_**
35
+ - Followed by dataSet. Pie slices will be ordered clockwise in the same order as the labels.
36
+ - `label` for a section in the pie diagram within `" "` quotes.
37
+ - Followed by `:` colon as separator
38
+ - Followed by `positive numeric value` (supported up to two decimal places)
39
+
40
+ **Note:**
41
+
42
+ > Pie chart values must be **positive numbers greater than zero**.
43
+ > **Negative values are not allowed** and will result in an error.
44
+
45
+ \[pie] \[showData] (OPTIONAL)
46
+ \[title] \[titlevalue] (OPTIONAL)
47
+ "\[datakey1]" : \[dataValue1]
48
+ "\[datakey2]" : \[dataValue2]
49
+ "\[datakey3]" : \[dataValue3]
50
+ .
51
+ .
52
+
53
+ ## Example
54
+
55
+ ```mermaid-example
56
+ ---
57
+ config:
58
+ pie:
59
+ textPosition: 0.5
60
+ themeVariables:
61
+ pieOuterStrokeWidth: "5px"
62
+ ---
63
+ pie showData
64
+ title Key elements in Product X
65
+ "Calcium" : 42.96
66
+ "Potassium" : 50.05
67
+ "Magnesium" : 10.01
68
+ "Iron" : 5
69
+ ```
70
+
71
+ ```mermaid
72
+ ---
73
+ config:
74
+ pie:
75
+ textPosition: 0.5
76
+ themeVariables:
77
+ pieOuterStrokeWidth: "5px"
78
+ ---
79
+ pie showData
80
+ title Key elements in Product X
81
+ "Calcium" : 42.96
82
+ "Potassium" : 50.05
83
+ "Magnesium" : 10.01
84
+ "Iron" : 5
85
+ ```
86
+
87
+ ## Configuration
88
+
89
+ Possible pie diagram configuration parameters:
90
+
91
+ | Parameter | Description | Default value |
92
+ | -------------- | ------------------------------------------------------------------------------------------------------------ | ------------- |
93
+ | `textPosition` | The axial position of the pie slice labels, from 0.0 at the center to 1.0 at the outside edge of the circle. | `0.75` |
@@ -0,0 +1,267 @@
1
+ > **Warning**
2
+ >
3
+ > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
4
+ >
5
+ > ## Please edit the corresponding file in [/packages/mermaid/src/docs/syntax/quadrantChart.md](../../packages/mermaid/src/docs/syntax/quadrantChart.md).
6
+
7
+ # Quadrant Chart
8
+
9
+ > A quadrant chart is a visual representation of data that is divided into four quadrants. It is used to plot data points on a two-dimensional grid, with one variable represented on the x-axis and another variable represented on the y-axis. The quadrants are determined by dividing the chart into four equal parts based on a set of criteria that is specific to the data being analyzed. Quadrant charts are often used to identify patterns and trends in data, and to prioritize actions based on the position of data points within the chart. They are commonly used in business, marketing, and risk management, among other fields.
10
+
11
+ ## Example
12
+
13
+ ```mermaid-example
14
+ quadrantChart
15
+ title Reach and engagement of campaigns
16
+ x-axis Low Reach --> High Reach
17
+ y-axis Low Engagement --> High Engagement
18
+ quadrant-1 We should expand
19
+ quadrant-2 Need to promote
20
+ quadrant-3 Re-evaluate
21
+ quadrant-4 May be improved
22
+ Campaign A: [0.3, 0.6]
23
+ Campaign B: [0.45, 0.23]
24
+ Campaign C: [0.57, 0.69]
25
+ Campaign D: [0.78, 0.34]
26
+ Campaign E: [0.40, 0.34]
27
+ Campaign F: [0.35, 0.78]
28
+ ```
29
+
30
+ ```mermaid
31
+ quadrantChart
32
+ title Reach and engagement of campaigns
33
+ x-axis Low Reach --> High Reach
34
+ y-axis Low Engagement --> High Engagement
35
+ quadrant-1 We should expand
36
+ quadrant-2 Need to promote
37
+ quadrant-3 Re-evaluate
38
+ quadrant-4 May be improved
39
+ Campaign A: [0.3, 0.6]
40
+ Campaign B: [0.45, 0.23]
41
+ Campaign C: [0.57, 0.69]
42
+ Campaign D: [0.78, 0.34]
43
+ Campaign E: [0.40, 0.34]
44
+ Campaign F: [0.35, 0.78]
45
+ ```
46
+
47
+ ## Syntax
48
+
49
+ > **Note**
50
+ > If there are no points available in the chart both **axis** text and **quadrant** will be rendered in the center of the respective quadrant.
51
+ > If there are points **x-axis** labels will rendered from the left of the respective quadrant also they will be displayed at the bottom of the chart, and **y-axis** labels will be rendered at the bottom of the respective quadrant, the quadrant text will render at the top of the respective quadrant.
52
+
53
+ > **Note**
54
+ > For points x and y value min value is 0 and max value is 1.
55
+
56
+ ### Title
57
+
58
+ The title is a short description of the chart and it will always render on top of the chart.
59
+
60
+ #### Example
61
+
62
+ ```
63
+ quadrantChart
64
+ title This is a sample example
65
+ ```
66
+
67
+ ### x-axis
68
+
69
+ The x-axis determines what text would be displayed in the x-axis. In x-axis there is two part **left** and **right** you can pass **both** or you can pass only **left**. The statement should start with `x-axis` then the `left axis text` followed by the delimiter `-->` then `right axis text`.
70
+
71
+ #### Example
72
+
73
+ 1. `x-axis <text> --> <text>` both the left and right axis text will be rendered.
74
+ 2. `x-axis <text>` only the left axis text will be rendered.
75
+
76
+ ### y-axis
77
+
78
+ The y-axis determines what text would be displayed in the y-axis. In y-axis there is two part **top** and **bottom** you can pass **both** or you can pass only **bottom**. The statement should start with `y-axis` then the `bottom axis text` followed by the delimiter `-->` then `top axis text`.
79
+
80
+ #### Example
81
+
82
+ 1. `y-axis <text> --> <text>` both the bottom and top axis text will be rendered.
83
+ 2. `y-axis <text>` only the bottom axis text will be rendered.
84
+
85
+ ### Quadrants text
86
+
87
+ The `quadrant-[1,2,3,4]` determine what text would be displayed inside the quadrants.
88
+
89
+ #### Example
90
+
91
+ 1. `quadrant-1 <text>` determine what text will be rendered inside the top right quadrant.
92
+ 2. `quadrant-2 <text>` determine what text will be rendered inside the top left quadrant.
93
+ 3. `quadrant-3 <text>` determine what text will be rendered inside the bottom left quadrant.
94
+ 4. `quadrant-4 <text>` determine what text will be rendered inside the bottom right quadrant.
95
+
96
+ ### Points
97
+
98
+ Points are used to plot a circle inside the quadrantChart. The syntax is `<text>: [x, y]` here x and y value is in the range 0 - 1.
99
+
100
+ #### Example
101
+
102
+ 1. `Point 1: [0.75, 0.80]` here the Point 1 will be drawn in the top right quadrant.
103
+ 2. `Point 2: [0.35, 0.24]` here the Point 2 will be drawn in the bottom left quadrant.
104
+
105
+ ## Chart Configurations
106
+
107
+ | Parameter | Description | Default value |
108
+ | --------------------------------- | -------------------------------------------------------------------------------------------------- | :-----------: |
109
+ | chartWidth | Width of the chart | 500 |
110
+ | chartHeight | Height of the chart | 500 |
111
+ | titlePadding | Top and Bottom padding of the title | 10 |
112
+ | titleFontSize | Title font size | 20 |
113
+ | quadrantPadding | Padding outside all the quadrants | 5 |
114
+ | quadrantTextTopPadding | Quadrant text top padding when text is drawn on top ( not data points are there) | 5 |
115
+ | quadrantLabelFontSize | Quadrant text font size | 16 |
116
+ | quadrantInternalBorderStrokeWidth | Border stroke width inside the quadrants | 1 |
117
+ | quadrantExternalBorderStrokeWidth | Quadrant external border stroke width | 2 |
118
+ | xAxisLabelPadding | Top and bottom padding of x-axis text | 5 |
119
+ | xAxisLabelFontSize | X-axis texts font size | 16 |
120
+ | xAxisPosition | Position of x-axis (top , bottom) if there are points the x-axis will always be rendered in bottom | 'top' |
121
+ | yAxisLabelPadding | Left and Right padding of y-axis text | 5 |
122
+ | yAxisLabelFontSize | Y-axis texts font size | 16 |
123
+ | yAxisPosition | Position of y-axis (left , right) | 'left' |
124
+ | pointTextPadding | Padding between point and the below text | 5 |
125
+ | pointLabelFontSize | Point text font size | 12 |
126
+ | pointRadius | Radius of the point to be drawn | 5 |
127
+
128
+ ## Chart Theme Variables
129
+
130
+ | Parameter | Description |
131
+ | -------------------------------- | --------------------------------------- |
132
+ | quadrant1Fill | Fill color of the top right quadrant |
133
+ | quadrant2Fill | Fill color of the top left quadrant |
134
+ | quadrant3Fill | Fill color of the bottom left quadrant |
135
+ | quadrant4Fill | Fill color of the bottom right quadrant |
136
+ | quadrant1TextFill | Text color of the top right quadrant |
137
+ | quadrant2TextFill | Text color of the top left quadrant |
138
+ | quadrant3TextFill | Text color of the bottom left quadrant |
139
+ | quadrant4TextFill | Text color of the bottom right quadrant |
140
+ | quadrantPointFill | Points fill color |
141
+ | quadrantPointTextFill | Points text color |
142
+ | quadrantXAxisTextFill | X-axis text color |
143
+ | quadrantYAxisTextFill | Y-axis text color |
144
+ | quadrantInternalBorderStrokeFill | Quadrants inner border color |
145
+ | quadrantExternalBorderStrokeFill | Quadrants outer border color |
146
+ | quadrantTitleFill | Title color |
147
+
148
+ ## Example on config and theme
149
+
150
+ ```mermaid-example
151
+ ---
152
+ config:
153
+ quadrantChart:
154
+ chartWidth: 400
155
+ chartHeight: 400
156
+ themeVariables:
157
+ quadrant1TextFill: "ff0000"
158
+ ---
159
+ quadrantChart
160
+ x-axis Urgent --> Not Urgent
161
+ y-axis Not Important --> "Important ❤"
162
+ quadrant-1 Plan
163
+ quadrant-2 Do
164
+ quadrant-3 Delegate
165
+ quadrant-4 Delete
166
+ ```
167
+
168
+ ```mermaid
169
+ ---
170
+ config:
171
+ quadrantChart:
172
+ chartWidth: 400
173
+ chartHeight: 400
174
+ themeVariables:
175
+ quadrant1TextFill: "ff0000"
176
+ ---
177
+ quadrantChart
178
+ x-axis Urgent --> Not Urgent
179
+ y-axis Not Important --> "Important ❤"
180
+ quadrant-1 Plan
181
+ quadrant-2 Do
182
+ quadrant-3 Delegate
183
+ quadrant-4 Delete
184
+ ```
185
+
186
+ ### Point styling
187
+
188
+ Points can either be styled directly or with defined shared classes
189
+
190
+ 1. Direct styling
191
+
192
+ ```md
193
+ Point A: [0.9, 0.0] radius: 12
194
+ Point B: [0.8, 0.1] color: #ff3300, radius: 10
195
+ Point C: [0.7, 0.2] radius: 25, color: #00ff33, stroke-color: #10f0f0
196
+ Point D: [0.6, 0.3] radius: 15, stroke-color: #00ff0f, stroke-width: 5px ,color: #ff33f0
197
+ ```
198
+
199
+ 2. Classes styling
200
+
201
+ ```md
202
+ Point A:::class1: [0.9, 0.0]
203
+ Point B:::class2: [0.8, 0.1]
204
+ Point C:::class3: [0.7, 0.2]
205
+ Point D:::class3: [0.7, 0.2]
206
+ classDef class1 color: #109060
207
+ classDef class2 color: #908342, radius : 10, stroke-color: #310085, stroke-width: 10px
208
+ classDef class3 color: #f00fff, radius : 10
209
+ ```
210
+
211
+ #### Available styles:
212
+
213
+ | Parameter | Description |
214
+ | ------------ | ---------------------------------------------------------------------- |
215
+ | color | Fill color of the point |
216
+ | radius | Radius of the point |
217
+ | stroke-width | Border width of the point |
218
+ | stroke-color | Border color of the point (useless when stroke-width is not specified) |
219
+
220
+ > **Note**
221
+ > Order of preference:
222
+ >
223
+ > 1. Direct styles
224
+ > 2. Class styles
225
+ > 3. Theme styles
226
+
227
+ ## Example on styling
228
+
229
+ ```mermaid-example
230
+ quadrantChart
231
+ title Reach and engagement of campaigns
232
+ x-axis Low Reach --> High Reach
233
+ y-axis Low Engagement --> High Engagement
234
+ quadrant-1 We should expand
235
+ quadrant-2 Need to promote
236
+ quadrant-3 Re-evaluate
237
+ quadrant-4 May be improved
238
+ Campaign A: [0.9, 0.0] radius: 12
239
+ Campaign B:::class1: [0.8, 0.1] color: #ff3300, radius: 10
240
+ Campaign C: [0.7, 0.2] radius: 25, color: #00ff33, stroke-color: #10f0f0
241
+ Campaign D: [0.6, 0.3] radius: 15, stroke-color: #00ff0f, stroke-width: 5px ,color: #ff33f0
242
+ Campaign E:::class2: [0.5, 0.4]
243
+ Campaign F:::class3: [0.4, 0.5] color: #0000ff
244
+ classDef class1 color: #109060
245
+ classDef class2 color: #908342, radius : 10, stroke-color: #310085, stroke-width: 10px
246
+ classDef class3 color: #f00fff, radius : 10
247
+ ```
248
+
249
+ ```mermaid
250
+ quadrantChart
251
+ title Reach and engagement of campaigns
252
+ x-axis Low Reach --> High Reach
253
+ y-axis Low Engagement --> High Engagement
254
+ quadrant-1 We should expand
255
+ quadrant-2 Need to promote
256
+ quadrant-3 Re-evaluate
257
+ quadrant-4 May be improved
258
+ Campaign A: [0.9, 0.0] radius: 12
259
+ Campaign B:::class1: [0.8, 0.1] color: #ff3300, radius: 10
260
+ Campaign C: [0.7, 0.2] radius: 25, color: #00ff33, stroke-color: #10f0f0
261
+ Campaign D: [0.6, 0.3] radius: 15, stroke-color: #00ff0f, stroke-width: 5px ,color: #ff33f0
262
+ Campaign E:::class2: [0.5, 0.4]
263
+ Campaign F:::class3: [0.4, 0.5] color: #0000ff
264
+ classDef class1 color: #109060
265
+ classDef class2 color: #908342, radius : 10, stroke-color: #310085, stroke-width: 10px
266
+ classDef class3 color: #f00fff, radius : 10
267
+ ```
@@ -0,0 +1,269 @@
1
+ > **Warning**
2
+ >
3
+ > ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
4
+ >
5
+ > ## Please edit the corresponding file in [/packages/mermaid/src/docs/syntax/radar.md](../../packages/mermaid/src/docs/syntax/radar.md).
6
+
7
+ # Radar Diagram (v11.6.0+)
8
+
9
+ ## Introduction
10
+
11
+ A radar diagram is a simple way to plot low-dimensional data in a circular format.
12
+
13
+ It is also known as a **radar chart**, **spider chart**, **star chart**, **cobweb chart**, **polar chart**, or **Kiviat diagram**.
14
+
15
+ ## Usage
16
+
17
+ This diagram type is particularly useful for developers, data scientists, and engineers who require a clear and concise way to represent data in a circular format.
18
+
19
+ It is commonly used to graphically summarize and compare the performance of multiple entities across multiple dimensions.
20
+
21
+ ## Syntax
22
+
23
+ ```md
24
+ radar-beta
25
+ axis A, B, C, D, E
26
+ curve c1{1,2,3,4,5}
27
+ curve c2{5,4,3,2,1}
28
+ ... More Fields ...
29
+ ```
30
+
31
+ ## Examples
32
+
33
+ ```mermaid-example
34
+ ---
35
+ title: "Grades"
36
+ ---
37
+ radar-beta
38
+ axis m["Math"], s["Science"], e["English"]
39
+ axis h["History"], g["Geography"], a["Art"]
40
+ curve a["Alice"]{85, 90, 80, 70, 75, 90}
41
+ curve b["Bob"]{70, 75, 85, 80, 90, 85}
42
+
43
+ max 100
44
+ min 0
45
+ ```
46
+
47
+ ```mermaid
48
+ ---
49
+ title: "Grades"
50
+ ---
51
+ radar-beta
52
+ axis m["Math"], s["Science"], e["English"]
53
+ axis h["History"], g["Geography"], a["Art"]
54
+ curve a["Alice"]{85, 90, 80, 70, 75, 90}
55
+ curve b["Bob"]{70, 75, 85, 80, 90, 85}
56
+
57
+ max 100
58
+ min 0
59
+ ```
60
+
61
+ ```mermaid-example
62
+ radar-beta
63
+ title Restaurant Comparison
64
+ axis food["Food Quality"], service["Service"], price["Price"]
65
+ axis ambiance["Ambiance"]
66
+
67
+ curve a["Restaurant A"]{4, 3, 2, 4}
68
+ curve b["Restaurant B"]{3, 4, 3, 3}
69
+ curve c["Restaurant C"]{2, 3, 4, 2}
70
+ curve d["Restaurant D"]{2, 2, 4, 3}
71
+
72
+ graticule polygon
73
+ max 5
74
+
75
+ ```
76
+
77
+ ```mermaid
78
+ radar-beta
79
+ title Restaurant Comparison
80
+ axis food["Food Quality"], service["Service"], price["Price"]
81
+ axis ambiance["Ambiance"]
82
+
83
+ curve a["Restaurant A"]{4, 3, 2, 4}
84
+ curve b["Restaurant B"]{3, 4, 3, 3}
85
+ curve c["Restaurant C"]{2, 3, 4, 2}
86
+ curve d["Restaurant D"]{2, 2, 4, 3}
87
+
88
+ graticule polygon
89
+ max 5
90
+
91
+ ```
92
+
93
+ ## Details of Syntax
94
+
95
+ ### Title
96
+
97
+ `title`: The title is an optional field that allows to render a title at the top of the radar diagram.
98
+
99
+ ```
100
+ radar-beta
101
+ title Title of the Radar Diagram
102
+ ...
103
+ ```
104
+
105
+ ### Axis
106
+
107
+ `axis`: The axis keyword is used to define the axes of the radar diagram.
108
+
109
+ Each axis is represented by an ID and an optional label.
110
+
111
+ Multiple axes can be defined in a single line.
112
+
113
+ ```
114
+ radar-beta
115
+ axis id1["Label1"]
116
+ axis id2["Label2"], id3["Label3"]
117
+ ...
118
+ ```
119
+
120
+ ### Curve
121
+
122
+ `curve`: The curve keyword is used to define the data points for a curve in the radar diagram.
123
+
124
+ Each curve is represented by an ID, an optional label, and a list of values.
125
+
126
+ Values can be defined by a list of numbers or a list of key-value pairs. If key-value pairs are used, the key represents the axis ID and the value represents the data point. Else, the data points are assumed to be in the order of the axes defined.
127
+
128
+ Multiple curves can be defined in a single line.
129
+
130
+ ```
131
+ radar-beta
132
+ axis axis1, axis2, axis3
133
+ curve id1["Label1"]{1, 2, 3}
134
+ curve id2["Label2"]{4, 5, 6}, id3{7, 8, 9}
135
+ curve id4{ axis3: 30, axis1: 20, axis2: 10 }
136
+ ...
137
+ ```
138
+
139
+ ### Options
140
+
141
+ - `showLegend`: The showLegend keyword is used to show or hide the legend in the radar diagram. The legend is shown by default.
142
+ - `max`: The maximum value for the radar diagram. This is used to scale the radar diagram. If not provided, the maximum value is calculated from the data points.
143
+ - `min`: The minimum value for the radar diagram. This is used to scale the radar diagram. If not provided, the minimum value is `0`.
144
+ - `graticule`: The graticule keyword is used to define the type of graticule to be rendered in the radar diagram. The graticule can be `circle` or `polygon`. If not provided, the default graticule is `circle`.
145
+ - `ticks`: The ticks keyword is used to define the number of ticks on the graticule. It is the number of concentric circles or polygons drawn to indicate the scale of the radar diagram. If not provided, the default number of ticks is `5`.
146
+
147
+ ```
148
+ radar-beta
149
+ ...
150
+ showLegend true
151
+ max 100
152
+ min 0
153
+ graticule circle
154
+ ticks 5
155
+ ...
156
+ ```
157
+
158
+ ## Configuration
159
+
160
+ Please refer to the [configuration](/config/schema-docs/config-defs-radar-diagram-config.html) guide for details.
161
+
162
+ | Parameter | Description | Default Value |
163
+ | --------------- | ---------------------------------------- | ------------- |
164
+ | width | Width of the radar diagram | `600` |
165
+ | height | Height of the radar diagram | `600` |
166
+ | marginTop | Top margin of the radar diagram | `50` |
167
+ | marginBottom | Bottom margin of the radar diagram | `50` |
168
+ | marginLeft | Left margin of the radar diagram | `50` |
169
+ | marginRight | Right margin of the radar diagram | `50` |
170
+ | axisScaleFactor | Scale factor for the axis | `1` |
171
+ | axisLabelFactor | Factor to adjust the axis label position | `1.05` |
172
+ | curveTension | Tension for the rounded curves | `0.17` |
173
+
174
+ ## Theme Variables
175
+
176
+ ### Global Theme Variables
177
+
178
+ > **Note**
179
+ > The default values for these variables depend on the theme used. To override the default values, set the desired values in the themeVariables section of the configuration:
180
+ >
181
+ > ---
182
+ >
183
+ > config:
184
+ > themeVariables:
185
+ > cScale0: "#FF0000"
186
+ > cScale1: "#00FF00"
187
+ >
188
+ > ---
189
+
190
+ Radar charts support the color scales `cScale${i}` where `i` is a number from `0` to the theme's maximum number of colors in its color scale. Usually, the maximum number of colors is `12`.
191
+
192
+ | Property | Description |
193
+ | ---------- | ------------------------------ |
194
+ | fontSize | Font size of the title |
195
+ | titleColor | Color of the title |
196
+ | cScale${i} | Color scale for the i-th curve |
197
+
198
+ ### Radar Style Options
199
+
200
+ > **Note**
201
+ > Specific variables for radar resides inside the `radar` key. To set the radar style options, use this syntax.
202
+ >
203
+ > ---
204
+ >
205
+ > config:
206
+ > themeVariables:
207
+ > radar:
208
+ > axisColor: "#FF0000"
209
+ >
210
+ > ---
211
+
212
+ | Property | Description | Default Value |
213
+ | -------------------- | ---------------------------- | ------------- |
214
+ | axisColor | Color of the axis lines | `black` |
215
+ | axisStrokeWidth | Width of the axis lines | `1` |
216
+ | axisLabelFontSize | Font size of the axis labels | `12px` |
217
+ | curveOpacity | Opacity of the curves | `0.7` |
218
+ | curveStrokeWidth | Width of the curves | `2` |
219
+ | graticuleColor | Color of the graticule | `black` |
220
+ | graticuleOpacity | Opacity of the graticule | `0.5` |
221
+ | graticuleStrokeWidth | Width of the graticule | `1` |
222
+ | legendBoxSize | Size of the legend box | `10` |
223
+ | legendFontSize | Font size of the legend | `14px` |
224
+
225
+ ## Example on config and theme
226
+
227
+ ```mermaid-example
228
+ ---
229
+ config:
230
+ radar:
231
+ axisScaleFactor: 0.25
232
+ curveTension: 0.1
233
+ theme: base
234
+ themeVariables:
235
+ cScale0: "#FF0000"
236
+ cScale1: "#00FF00"
237
+ cScale2: "#0000FF"
238
+ radar:
239
+ curveOpacity: 0
240
+ ---
241
+ radar-beta
242
+ axis A, B, C, D, E
243
+ curve c1{1,2,3,4,5}
244
+ curve c2{5,4,3,2,1}
245
+ curve c3{3,3,3,3,3}
246
+ ```
247
+
248
+ ```mermaid
249
+ ---
250
+ config:
251
+ radar:
252
+ axisScaleFactor: 0.25
253
+ curveTension: 0.1
254
+ theme: base
255
+ themeVariables:
256
+ cScale0: "#FF0000"
257
+ cScale1: "#00FF00"
258
+ cScale2: "#0000FF"
259
+ radar:
260
+ curveOpacity: 0
261
+ ---
262
+ radar-beta
263
+ axis A, B, C, D, E
264
+ curve c1{1,2,3,4,5}
265
+ curve c2{5,4,3,2,1}
266
+ curve c3{3,3,3,3,3}
267
+ ```
268
+
269
+ <!--- cspell:ignore Kiviat --->