mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-08-15 22:39:26 +02:00
Compare commits
27 Commits
update-pro
...
@mermaid-j
Author | SHA1 | Date | |
---|---|---|---|
![]() |
7b2083926d | ||
![]() |
bb9210c55e | ||
![]() |
16d9b63457 | ||
![]() |
bf3370fa5b | ||
![]() |
9f9091e5e4 | ||
![]() |
d1b1a67d99 | ||
![]() |
ac625bdc7f | ||
![]() |
40b85c3bbf | ||
![]() |
f8e329f890 | ||
![]() |
9b9cec9809 | ||
![]() |
ad653138e1 | ||
![]() |
f5f3b08f12 | ||
![]() |
85ce310884 | ||
![]() |
fac570cb8c | ||
![]() |
a7bcd7dee5 | ||
![]() |
bb5a7a585e | ||
![]() |
5d1b27132a | ||
![]() |
288abd01e0 | ||
![]() |
95d73bc3f0 | ||
![]() |
0f5125b5e3 | ||
![]() |
12c120368d | ||
![]() |
a7f2c0bc34 | ||
![]() |
5e97b2f764 | ||
![]() |
d53c66dde5 | ||
![]() |
1fb91d14c9 | ||
![]() |
d80cc38bb2 | ||
![]() |
d6022408a9 |
@@ -27,6 +27,7 @@ const MERMAID_CONFIG_DIAGRAM_KEYS = [
|
||||
'block',
|
||||
'packet',
|
||||
'architecture',
|
||||
'radar',
|
||||
] as const;
|
||||
|
||||
/**
|
||||
|
@@ -1,8 +1,8 @@
|
||||
import eyesPlugin from '@applitools/eyes-cypress';
|
||||
import { registerArgosTask } from '@argos-ci/cypress/task';
|
||||
import coverage from '@cypress/code-coverage/task';
|
||||
import coverage from '@cypress/code-coverage/task.js';
|
||||
import { defineConfig } from 'cypress';
|
||||
import { addMatchImageSnapshotPlugin } from 'cypress-image-snapshot/plugin';
|
||||
import { addMatchImageSnapshotPlugin } from 'cypress-image-snapshot/plugin.js';
|
||||
import cypressSplit from 'cypress-split';
|
||||
|
||||
export default eyesPlugin(
|
||||
|
79
cypress/integration/rendering/radar.spec.js
Normal file
79
cypress/integration/rendering/radar.spec.js
Normal file
@@ -0,0 +1,79 @@
|
||||
import { imgSnapshotTest } from '../../helpers/util';
|
||||
|
||||
describe('radar structure', () => {
|
||||
it('should render a simple radar diagram', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
title Best Radar Ever
|
||||
axis A, B, C
|
||||
curve c1{1, 2, 3}
|
||||
`
|
||||
);
|
||||
});
|
||||
|
||||
it('should render a radar diagram with multiple curves', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
title Best Radar Ever
|
||||
axis A, B, C
|
||||
curve c1{1, 2, 3}
|
||||
curve c2{2, 3, 1}
|
||||
`
|
||||
);
|
||||
});
|
||||
|
||||
it('should render a complex radar diagram', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
title My favorite ninjas
|
||||
axis Agility, Speed, Strength
|
||||
axis Stam["Stamina"] , Intel["Intelligence"]
|
||||
|
||||
curve Ninja1["Naruto Uzumaki"]{
|
||||
Agility 2, Speed 2,
|
||||
Strength 3, Stam 5,
|
||||
Intel 0
|
||||
}
|
||||
curve Ninja2["Sasuke"]{2, 3, 4, 1, 5}
|
||||
curve Ninja3 {3, 2, 1, 5, 4}
|
||||
|
||||
showLegend true
|
||||
ticks 3
|
||||
max 8
|
||||
min 0
|
||||
graticule polygon
|
||||
`
|
||||
);
|
||||
cy.get('svg').should((svg) => {
|
||||
expect(svg).to.have.length(1);
|
||||
});
|
||||
});
|
||||
|
||||
it('should render radar diagram with config override', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
title Best Radar Ever
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}`,
|
||||
{ radar: { marginTop: 100, axisScaleFactor: 0.5 } }
|
||||
);
|
||||
});
|
||||
|
||||
it('should parse radar diagram with theme override', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}`,
|
||||
{ theme: 'base', themeVariables: { fontSize: 80, cScale0: '#FF0000' } }
|
||||
);
|
||||
});
|
||||
|
||||
it('should handle radar diagram with radar style override', () => {
|
||||
imgSnapshotTest(
|
||||
`radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}`,
|
||||
{ theme: 'base', themeVariables: { radar: { axisColor: '#FF0000' } } }
|
||||
);
|
||||
});
|
||||
});
|
@@ -91,6 +91,9 @@
|
||||
<li>
|
||||
<h2><a href="./architecture.html">Architecture</a></h2>
|
||||
</li>
|
||||
<li>
|
||||
<h2><a href="./radar.html">Radar</a></h2>
|
||||
</li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
157
demos/radar.html
Normal file
157
demos/radar.html
Normal file
@@ -0,0 +1,157 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<title>Mermaid Quick Test Page</title>
|
||||
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
|
||||
<style>
|
||||
div.mermaid {
|
||||
font-family: 'Courier New', Courier, monospace !important;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Radar diagram demo</h1>
|
||||
|
||||
<div class="diagrams">
|
||||
<pre class="mermaid">
|
||||
radar-beta
|
||||
title My favorite ninjas
|
||||
axis Agility, Speed, Strength
|
||||
axis Stam["Stamina"] , Intel["Intelligence"]
|
||||
|
||||
curve Ninja1["Naruto"]{
|
||||
Agility 2, Speed 2,
|
||||
Strength 3, Stam 5,
|
||||
Intel 0
|
||||
}
|
||||
curve Ninja2["Sasuke"]{2, 3, 4, 1, 5}
|
||||
curve Ninja3["Ninja"] {3, 2, 1, 5, 4}
|
||||
|
||||
showLegend true
|
||||
ticks 3
|
||||
max 8
|
||||
min 0
|
||||
graticule circle
|
||||
</pre
|
||||
>
|
||||
|
||||
<pre class="mermaid">
|
||||
---
|
||||
config:
|
||||
radar:
|
||||
axisScaleFactor: 0.25
|
||||
axisLabelFactor: 0.95
|
||||
---
|
||||
radar-beta
|
||||
title DevOps Radar
|
||||
axis f["Feature Velocity"], s["Stability"]
|
||||
axis r["Resilience"], e["Efficiency"]
|
||||
axis c["Cost"], d["DevSecOps"]
|
||||
|
||||
curve app1["App1"]{
|
||||
f 5, s 4.5, r 3.8, d 4.2, e 4.5, c 3.5
|
||||
}
|
||||
curve app2["App2"]{4, 3, 4, 3, 3, 4}, app3["App3"]{3, 2, 4, 3, 2, 3}
|
||||
curve app4["App4"]{2, 1, 3.2, 2.5, 1, 2}
|
||||
|
||||
showLegend true
|
||||
ticks 3
|
||||
max 5
|
||||
graticule polygon
|
||||
</pre
|
||||
>
|
||||
|
||||
<pre class="mermaid">
|
||||
%%{init: {'theme': 'forest'} }%%
|
||||
radar-beta
|
||||
title Forest theme
|
||||
axis Agility, Speed, Strength
|
||||
axis Stam["Stamina"] , Intel["Intelligence"]
|
||||
|
||||
curve Ninja1["Naruto"]{
|
||||
Agility 2, Speed 2,
|
||||
Strength 3, Stam 5,
|
||||
Intel 0
|
||||
}
|
||||
curve Ninja2["Sasuke"]{2, 3, 4, 1, 5}
|
||||
curve Ninja3["Ninja"] {3, 2, 1, 5, 4}
|
||||
</pre
|
||||
>
|
||||
|
||||
<pre class="mermaid" style="background-color: black">
|
||||
%%{init: {'theme': 'dark'} }%%
|
||||
radar-beta
|
||||
title Dark theme
|
||||
axis Agility, Speed, Strength
|
||||
axis Stam["Stamina"] , Intel["Intelligence"]
|
||||
|
||||
curve Ninja1["Naruto"]{
|
||||
Agility 2, Speed 2,
|
||||
Strength 3, Stam 5,
|
||||
Intel 0
|
||||
}
|
||||
curve Ninja2["Sasuke"]{2, 3, 4, 1, 5}
|
||||
curve Ninja3["Ninja"] {3, 2, 1, 5, 4}
|
||||
</pre
|
||||
>
|
||||
<pre class="mermaid">
|
||||
%%{init: {'theme': 'base', 'themeVariables': {'cScale0': '#ff0000', 'cScale1': '#00ff00', 'cScale2': '#0000ff'}} }%%
|
||||
radar-beta
|
||||
title Custom colors
|
||||
axis Agility, Speed, Strength
|
||||
axis Stam["Stamina"] , Intel["Intelligence"]
|
||||
|
||||
curve Ninja1["Naruto"]{
|
||||
Agility 2, Speed 2,
|
||||
Strength 3, Stam 5,
|
||||
Intel 0
|
||||
}
|
||||
curve Ninja2["Sasuke"]{2, 3, 4, 1, 5}
|
||||
curve Ninja3["Ninja"] {3, 2, 1, 5, 4}
|
||||
</pre
|
||||
>
|
||||
<pre class="mermaid">
|
||||
---
|
||||
config:
|
||||
radar:
|
||||
axisScaleFactor: 0.25
|
||||
curveTension: 0.1
|
||||
theme: base
|
||||
themeVariables:
|
||||
cScale0: "#FF0000"
|
||||
cScale1: "#00FF00"
|
||||
cScale2: "#0000FF"
|
||||
radar:
|
||||
curveOpacity: 0
|
||||
---
|
||||
radar-beta
|
||||
title Custom colors, axisScaleFactor, curveTension, opacity
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
curve c3{3,3,3,3,3}
|
||||
</pre>
|
||||
</div>
|
||||
<script type="module">
|
||||
import mermaid from '/mermaid.esm.mjs';
|
||||
mermaid.initialize({
|
||||
logLevel: 3,
|
||||
securityLevel: 'loose',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.diagrams {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
pre {
|
||||
width: 45vw;
|
||||
padding: 2em;
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
@@ -239,6 +239,22 @@ Code is the heart of every software project. We strive to make it better. Who if
|
||||
|
||||
The core of Mermaid is located under `packages/mermaid/src`.
|
||||
|
||||
### Building Mermaid Locally
|
||||
|
||||
**Host**
|
||||
|
||||
```bash
|
||||
pnpm run build
|
||||
```
|
||||
|
||||
**Docker**
|
||||
|
||||
```bash
|
||||
./run build
|
||||
```
|
||||
|
||||
This will build the Mermaid library and the documentation site.
|
||||
|
||||
### Running Mermaid Locally
|
||||
|
||||
**Host**
|
||||
|
@@ -4,12 +4,14 @@
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/README.md](../../../packages/mermaid/src/docs/config/setup/README.md).
|
||||
|
||||
**mermaid**
|
||||
|
||||
---
|
||||
|
||||
# mermaid
|
||||
|
||||
## Table of contents
|
||||
## Modules
|
||||
|
||||
### Modules
|
||||
|
||||
- [config](modules/config.md)
|
||||
- [defaultConfig](modules/defaultConfig.md)
|
||||
- [mermaid](modules/mermaid.md)
|
||||
- [config](config/README.md)
|
||||
- [defaultConfig](defaultConfig/README.md)
|
||||
- [mermaid](mermaid/README.md)
|
||||
|
@@ -1,190 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md](../../../../packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md).
|
||||
|
||||
# Class: UnknownDiagramError
|
||||
|
||||
[mermaid](../modules/mermaid.md).UnknownDiagramError
|
||||
|
||||
## Hierarchy
|
||||
|
||||
- `Error`
|
||||
|
||||
↳ **`UnknownDiagramError`**
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Constructors
|
||||
|
||||
- [constructor](mermaid.UnknownDiagramError.md#constructor)
|
||||
|
||||
### Properties
|
||||
|
||||
- [cause](mermaid.UnknownDiagramError.md#cause)
|
||||
- [message](mermaid.UnknownDiagramError.md#message)
|
||||
- [name](mermaid.UnknownDiagramError.md#name)
|
||||
- [stack](mermaid.UnknownDiagramError.md#stack)
|
||||
- [prepareStackTrace](mermaid.UnknownDiagramError.md#preparestacktrace)
|
||||
- [stackTraceLimit](mermaid.UnknownDiagramError.md#stacktracelimit)
|
||||
|
||||
### Methods
|
||||
|
||||
- [captureStackTrace](mermaid.UnknownDiagramError.md#capturestacktrace)
|
||||
|
||||
## Constructors
|
||||
|
||||
### constructor
|
||||
|
||||
• **new UnknownDiagramError**(`message`): [`UnknownDiagramError`](mermaid.UnknownDiagramError.md)
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :-------- | :------- |
|
||||
| `message` | `string` |
|
||||
|
||||
#### Returns
|
||||
|
||||
[`UnknownDiagramError`](mermaid.UnknownDiagramError.md)
|
||||
|
||||
#### Overrides
|
||||
|
||||
Error.constructor
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/errors.ts:2](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L2)
|
||||
|
||||
## Properties
|
||||
|
||||
### cause
|
||||
|
||||
• `Optional` **cause**: `unknown`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.cause
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es2022.error.d.ts:24
|
||||
|
||||
---
|
||||
|
||||
### message
|
||||
|
||||
• **message**: `string`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.message
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1077
|
||||
|
||||
---
|
||||
|
||||
### name
|
||||
|
||||
• **name**: `string`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.name
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1076
|
||||
|
||||
---
|
||||
|
||||
### stack
|
||||
|
||||
• `Optional` **stack**: `string`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.stack
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1078
|
||||
|
||||
---
|
||||
|
||||
### prepareStackTrace
|
||||
|
||||
▪ `Static` `Optional` **prepareStackTrace**: (`err`: `Error`, `stackTraces`: `CallSite`\[]) => `any`
|
||||
|
||||
Optional override for formatting stack traces
|
||||
|
||||
**`See`**
|
||||
|
||||
<https://v8.dev/docs/stack-trace-api#customizing-stack-traces>
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`err`, `stackTraces`): `any`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :------------ | :------------ |
|
||||
| `err` | `Error` |
|
||||
| `stackTraces` | `CallSite`\[] |
|
||||
|
||||
##### Returns
|
||||
|
||||
`any`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.prepareStackTrace
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:143
|
||||
|
||||
---
|
||||
|
||||
### stackTraceLimit
|
||||
|
||||
▪ `Static` **stackTraceLimit**: `number`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.stackTraceLimit
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:145
|
||||
|
||||
## Methods
|
||||
|
||||
### captureStackTrace
|
||||
|
||||
▸ **captureStackTrace**(`targetObject`, `constructorOpt?`): `void`
|
||||
|
||||
Create .stack property on a target object
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :---------------- | :--------- |
|
||||
| `targetObject` | `object` |
|
||||
| `constructorOpt?` | `Function` |
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
Error.captureStackTrace
|
||||
|
||||
#### Defined in
|
||||
|
||||
node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:136
|
28
docs/config/setup/config/README.md
Normal file
28
docs/config/setup/config/README.md
Normal file
@@ -0,0 +1,28 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/README.md](../../../../packages/mermaid/src/docs/config/setup/config/README.md).
|
||||
|
||||
[**mermaid**](../README.md)
|
||||
|
||||
---
|
||||
|
||||
# config
|
||||
|
||||
## Variables
|
||||
|
||||
- [defaultConfig](variables/defaultConfig.md)
|
||||
|
||||
## Functions
|
||||
|
||||
- [addDirective](functions/addDirective.md)
|
||||
- [getConfig](functions/getConfig.md)
|
||||
- [getSiteConfig](functions/getSiteConfig.md)
|
||||
- [reset](functions/reset.md)
|
||||
- [sanitize](functions/sanitize.md)
|
||||
- [saveConfigFromInitialize](functions/saveConfigFromInitialize.md)
|
||||
- [setConfig](functions/setConfig.md)
|
||||
- [setSiteConfig](functions/setSiteConfig.md)
|
||||
- [updateCurrentConfig](functions/updateCurrentConfig.md)
|
||||
- [updateSiteConfig](functions/updateSiteConfig.md)
|
29
docs/config/setup/config/functions/addDirective.md
Normal file
29
docs/config/setup/config/functions/addDirective.md
Normal file
@@ -0,0 +1,29 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/addDirective.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/addDirective.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: addDirective()
|
||||
|
||||
> **addDirective**(`directive`): `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188)
|
||||
|
||||
Pushes in a directive to the configuration
|
||||
|
||||
## Parameters
|
||||
|
||||
### directive
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The directive to push in
|
||||
|
||||
## Returns
|
||||
|
||||
`void`
|
29
docs/config/setup/config/functions/getConfig.md
Normal file
29
docs/config/setup/config/functions/getConfig.md
Normal file
@@ -0,0 +1,29 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/getConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/getConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: getConfig()
|
||||
|
||||
> **getConfig**(): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131)
|
||||
|
||||
## getConfig
|
||||
|
||||
| Function | Description | Type | Return Values |
|
||||
| --------- | ------------------------- | ----------- | ------------------------------ |
|
||||
| getConfig | Obtains the currentConfig | Get Request | Any Values from current Config |
|
||||
|
||||
**Notes**: Avoid calling this function repeatedly. Instead, store the result in a variable and use it, and pass it down to function calls.
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The currentConfig
|
29
docs/config/setup/config/functions/getSiteConfig.md
Normal file
29
docs/config/setup/config/functions/getSiteConfig.md
Normal file
@@ -0,0 +1,29 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/getSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/getSiteConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: getSiteConfig()
|
||||
|
||||
> **getSiteConfig**(): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96)
|
||||
|
||||
## getSiteConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------------------- | ----------- | -------------------------------- |
|
||||
| setSiteConfig | Returns the current siteConfig base configuration | Get Request | Returns Any Values in siteConfig |
|
||||
|
||||
**Notes**: Returns **any** values in siteConfig.
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The siteConfig
|
42
docs/config/setup/config/functions/reset.md
Normal file
42
docs/config/setup/config/functions/reset.md
Normal file
@@ -0,0 +1,42 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/reset.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/reset.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: reset()
|
||||
|
||||
> **reset**(`config`): `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:221](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L221)
|
||||
|
||||
## reset
|
||||
|
||||
| Function | Description | Type | Required | Values |
|
||||
| -------- | ---------------------------- | ----------- | -------- | ------ |
|
||||
| reset | Resets currentConfig to conf | Put Request | Required | None |
|
||||
|
||||
## conf
|
||||
|
||||
| Parameter | Description | Type | Required | Values |
|
||||
| --------- | -------------------------------------------------------------- | ---------- | -------- | -------------------------------------------- |
|
||||
| conf | base set of values, which currentConfig could be **reset** to. | Dictionary | Required | Any Values, with respect to the secure Array |
|
||||
|
||||
**Notes**: (default: current siteConfig ) (optional, default `getSiteConfig()`)
|
||||
|
||||
## Parameters
|
||||
|
||||
### config
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md) = `siteConfig`
|
||||
|
||||
base set of values, which currentConfig could be **reset** to.
|
||||
Defaults to the current siteConfig (e.g returned by [getSiteConfig](getSiteConfig.md)).
|
||||
|
||||
## Returns
|
||||
|
||||
`void`
|
36
docs/config/setup/config/functions/sanitize.md
Normal file
36
docs/config/setup/config/functions/sanitize.md
Normal file
@@ -0,0 +1,36 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/sanitize.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/sanitize.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: sanitize()
|
||||
|
||||
> **sanitize**(`options`): `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146)
|
||||
|
||||
## sanitize
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| -------- | -------------------------------------- | ----------- | ------ |
|
||||
| sanitize | Sets the siteConfig to desired values. | Put Request | None |
|
||||
|
||||
Ensures options parameter does not attempt to override siteConfig secure keys **Notes**: modifies
|
||||
options in-place
|
||||
|
||||
## Parameters
|
||||
|
||||
### options
|
||||
|
||||
`any`
|
||||
|
||||
The potential setConfig parameter
|
||||
|
||||
## Returns
|
||||
|
||||
`void`
|
@@ -0,0 +1,25 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/saveConfigFromInitialize.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/saveConfigFromInitialize.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: saveConfigFromInitialize()
|
||||
|
||||
> **saveConfigFromInitialize**(`conf`): `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75)
|
||||
|
||||
## Parameters
|
||||
|
||||
### conf
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
## Returns
|
||||
|
||||
`void`
|
39
docs/config/setup/config/functions/setConfig.md
Normal file
39
docs/config/setup/config/functions/setConfig.md
Normal file
@@ -0,0 +1,39 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/setConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/setConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: setConfig()
|
||||
|
||||
> **setConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113)
|
||||
|
||||
## setConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
|
||||
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
|
||||
|
||||
**Notes**: Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure
|
||||
keys. Any values found in conf with key found in siteConfig.secure will be replaced with the
|
||||
corresponding siteConfig value.
|
||||
|
||||
## Parameters
|
||||
|
||||
### conf
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The potential currentConfig
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The currentConfig merged with the sanitized conf
|
40
docs/config/setup/config/functions/setSiteConfig.md
Normal file
40
docs/config/setup/config/functions/setSiteConfig.md
Normal file
@@ -0,0 +1,40 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/setSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/setSiteConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: setSiteConfig()
|
||||
|
||||
> **setSiteConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61)
|
||||
|
||||
## setSiteConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
|
||||
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
|
||||
|
||||
**Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls
|
||||
to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig)
|
||||
will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this
|
||||
function _Default value: At default, will mirror Global Config_
|
||||
|
||||
## Parameters
|
||||
|
||||
### conf
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The base currentConfig to use as siteConfig
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
The new siteConfig
|
29
docs/config/setup/config/functions/updateCurrentConfig.md
Normal file
29
docs/config/setup/config/functions/updateCurrentConfig.md
Normal file
@@ -0,0 +1,29 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/updateCurrentConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/updateCurrentConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: updateCurrentConfig()
|
||||
|
||||
> **updateCurrentConfig**(`siteCfg`, `_directives`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15)
|
||||
|
||||
## Parameters
|
||||
|
||||
### siteCfg
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
### \_directives
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)\[]
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
25
docs/config/setup/config/functions/updateSiteConfig.md
Normal file
25
docs/config/setup/config/functions/updateSiteConfig.md
Normal file
@@ -0,0 +1,25 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/functions/updateSiteConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/functions/updateSiteConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Function: updateSiteConfig()
|
||||
|
||||
> **updateSiteConfig**(`conf`): [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79)
|
||||
|
||||
## Parameters
|
||||
|
||||
### conf
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
## Returns
|
||||
|
||||
[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
15
docs/config/setup/config/variables/defaultConfig.md
Normal file
15
docs/config/setup/config/variables/defaultConfig.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/config/variables/defaultConfig.md](../../../../../packages/mermaid/src/docs/config/setup/config/variables/defaultConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Variable: defaultConfig
|
||||
|
||||
> `const` **defaultConfig**: [`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8)
|
16
docs/config/setup/defaultConfig/README.md
Normal file
16
docs/config/setup/defaultConfig/README.md
Normal file
@@ -0,0 +1,16 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/README.md](../../../../packages/mermaid/src/docs/config/setup/defaultConfig/README.md).
|
||||
|
||||
[**mermaid**](../README.md)
|
||||
|
||||
---
|
||||
|
||||
# defaultConfig
|
||||
|
||||
## Variables
|
||||
|
||||
- [configKeys](variables/configKeys.md)
|
||||
- [default](variables/default.md)
|
15
docs/config/setup/defaultConfig/variables/configKeys.md
Normal file
15
docs/config/setup/defaultConfig/variables/configKeys.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/variables/configKeys.md](../../../../../packages/mermaid/src/docs/config/setup/defaultConfig/variables/configKeys.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Variable: configKeys
|
||||
|
||||
> `const` **configKeys**: `Set`<`string`>
|
||||
|
||||
Defined in: [packages/mermaid/src/defaultConfig.ts:274](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L274)
|
21
docs/config/setup/defaultConfig/variables/default.md
Normal file
21
docs/config/setup/defaultConfig/variables/default.md
Normal file
@@ -0,0 +1,21 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/defaultConfig/variables/default.md](../../../../../packages/mermaid/src/docs/config/setup/defaultConfig/variables/default.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Variable: default
|
||||
|
||||
> `const` **default**: `RequiredDeep`<[`MermaidConfig`](../../mermaid/interfaces/MermaidConfig.md)>
|
||||
|
||||
Defined in: [packages/mermaid/src/defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18)
|
||||
|
||||
Default mermaid configuration options.
|
||||
|
||||
Please see the Mermaid config JSON Schema for the default JSON values.
|
||||
Non-JSON JS default values are listed in this file, e.g. functions, or
|
||||
`undefined` (explicitly set so that `configKeys` finds them).
|
@@ -1,58 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md).
|
||||
|
||||
# Interface: DetailedError
|
||||
|
||||
[mermaid](../modules/mermaid.md).DetailedError
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [error](mermaid.DetailedError.md#error)
|
||||
- [hash](mermaid.DetailedError.md#hash)
|
||||
- [message](mermaid.DetailedError.md#message)
|
||||
- [str](mermaid.DetailedError.md#str)
|
||||
|
||||
## Properties
|
||||
|
||||
### error
|
||||
|
||||
• `Optional` **error**: `any`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/utils.ts:788](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L788)
|
||||
|
||||
---
|
||||
|
||||
### hash
|
||||
|
||||
• **hash**: `any`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/utils.ts:786](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L786)
|
||||
|
||||
---
|
||||
|
||||
### message
|
||||
|
||||
• `Optional` **message**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/utils.ts:789](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L789)
|
||||
|
||||
---
|
||||
|
||||
### str
|
||||
|
||||
• **str**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/utils.ts:784](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L784)
|
@@ -1,47 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md).
|
||||
|
||||
# Interface: ExternalDiagramDefinition
|
||||
|
||||
[mermaid](../modules/mermaid.md).ExternalDiagramDefinition
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [detector](mermaid.ExternalDiagramDefinition.md#detector)
|
||||
- [id](mermaid.ExternalDiagramDefinition.md#id)
|
||||
- [loader](mermaid.ExternalDiagramDefinition.md#loader)
|
||||
|
||||
## Properties
|
||||
|
||||
### detector
|
||||
|
||||
• **detector**: `DiagramDetector`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
|
||||
|
||||
---
|
||||
|
||||
### id
|
||||
|
||||
• **id**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
|
||||
|
||||
---
|
||||
|
||||
### loader
|
||||
|
||||
• **loader**: `DiagramLoader`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)
|
@@ -1,51 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutData.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutData.md).
|
||||
|
||||
# Interface: LayoutData
|
||||
|
||||
[mermaid](../modules/mermaid.md).LayoutData
|
||||
|
||||
## Indexable
|
||||
|
||||
▪ \[key: `string`]: `any`
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [config](mermaid.LayoutData.md#config)
|
||||
- [edges](mermaid.LayoutData.md#edges)
|
||||
- [nodes](mermaid.LayoutData.md#nodes)
|
||||
|
||||
## Properties
|
||||
|
||||
### config
|
||||
|
||||
• **config**: [`MermaidConfig`](mermaid.MermaidConfig.md)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/types.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L148)
|
||||
|
||||
---
|
||||
|
||||
### edges
|
||||
|
||||
• **edges**: `Edge`\[]
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/types.ts:147](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L147)
|
||||
|
||||
---
|
||||
|
||||
### nodes
|
||||
|
||||
• **nodes**: `Node`\[]
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/types.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L146)
|
@@ -1,47 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.LayoutLoaderDefinition.md).
|
||||
|
||||
# Interface: LayoutLoaderDefinition
|
||||
|
||||
[mermaid](../modules/mermaid.md).LayoutLoaderDefinition
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [algorithm](mermaid.LayoutLoaderDefinition.md#algorithm)
|
||||
- [loader](mermaid.LayoutLoaderDefinition.md#loader)
|
||||
- [name](mermaid.LayoutLoaderDefinition.md#name)
|
||||
|
||||
## Properties
|
||||
|
||||
### algorithm
|
||||
|
||||
• `Optional` **algorithm**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/render.ts:24](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L24)
|
||||
|
||||
---
|
||||
|
||||
### loader
|
||||
|
||||
• **loader**: `LayoutLoader`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/render.ts:23](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L23)
|
||||
|
||||
---
|
||||
|
||||
### name
|
||||
|
||||
• **name**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/render.ts:22](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L22)
|
@@ -1,407 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md).
|
||||
|
||||
# Interface: Mermaid
|
||||
|
||||
[mermaid](../modules/mermaid.md).Mermaid
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [contentLoaded](mermaid.Mermaid.md#contentloaded)
|
||||
- [detectType](mermaid.Mermaid.md#detecttype)
|
||||
- [init](mermaid.Mermaid.md#init)
|
||||
- [initialize](mermaid.Mermaid.md#initialize)
|
||||
- [mermaidAPI](mermaid.Mermaid.md#mermaidapi)
|
||||
- [parse](mermaid.Mermaid.md#parse)
|
||||
- [parseError](mermaid.Mermaid.md#parseerror)
|
||||
- [registerExternalDiagrams](mermaid.Mermaid.md#registerexternaldiagrams)
|
||||
- [registerIconPacks](mermaid.Mermaid.md#registericonpacks)
|
||||
- [registerLayoutLoaders](mermaid.Mermaid.md#registerlayoutloaders)
|
||||
- [render](mermaid.Mermaid.md#render)
|
||||
- [run](mermaid.Mermaid.md#run)
|
||||
- [setParseErrorHandler](mermaid.Mermaid.md#setparseerrorhandler)
|
||||
- [startOnLoad](mermaid.Mermaid.md#startonload)
|
||||
|
||||
## Properties
|
||||
|
||||
### contentLoaded
|
||||
|
||||
• **contentLoaded**: () => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (): `void`
|
||||
|
||||
\##contentLoaded Callback function that is called when page is loaded. This functions fetches
|
||||
configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the
|
||||
page.
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
|
||||
|
||||
---
|
||||
|
||||
### detectType
|
||||
|
||||
• **detectType**: (`text`: `string`, `config?`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `string`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`text`, `config?`): `string`
|
||||
|
||||
Detects the type of the graph text.
|
||||
|
||||
Takes into consideration the possible existence of an `%%init` directive
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :-------- | :------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| `text` | `string` | The text defining the graph. For example: `mermaid %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%% graph LR a-->b b-->c c-->d d-->e e-->f f-->g g-->h ` |
|
||||
| `config?` | [`MermaidConfig`](mermaid.MermaidConfig.md) | The mermaid config. |
|
||||
|
||||
##### Returns
|
||||
|
||||
`string`
|
||||
|
||||
A graph definition key
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
|
||||
|
||||
---
|
||||
|
||||
### init
|
||||
|
||||
• **init**: (`config?`: [`MermaidConfig`](mermaid.MermaidConfig.md), `nodes?`: `string` | `HTMLElement` | `NodeListOf`<`HTMLElement`>, `callback?`: (`id`: `string`) => `unknown`) => `Promise`<`void`>
|
||||
|
||||
**`Deprecated`**
|
||||
|
||||
Use [initialize](mermaid.Mermaid.md#initialize) and [run](mermaid.Mermaid.md#run) instead.
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`config?`, `nodes?`, `callback?`): `Promise`<`void`>
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :---------- | :------------------------------------------------------- |
|
||||
| `config?` | [`MermaidConfig`](mermaid.MermaidConfig.md) |
|
||||
| `nodes?` | `string` \| `HTMLElement` \| `NodeListOf`<`HTMLElement`> |
|
||||
| `callback?` | (`id`: `string`) => `unknown` |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
|
||||
|
||||
---
|
||||
|
||||
### initialize
|
||||
|
||||
• **initialize**: (`config`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`config`): `void`
|
||||
|
||||
Used to set configurations for mermaid.
|
||||
This function should be called before the run function.
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :------- | :------------------------------------------ | :-------------------------------- |
|
||||
| `config` | [`MermaidConfig`](mermaid.MermaidConfig.md) | Configuration object for mermaid. |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435)
|
||||
|
||||
---
|
||||
|
||||
### mermaidAPI
|
||||
|
||||
• **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.defaultConfig; `getConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getConfig; `getDiagramFromText`: (`text`: `string`, `metadata`: `Pick`<`DiagramMetadata`, `"title"`>) => `Promise`<`Diagram`> ; `getSiteConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getSiteConfig; `globalReset`: () => `void` ; `initialize`: (`userOptions`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void` ; `parse`: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)> ; `render`: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)> ; `reset`: () => `void` ; `setConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.setConfig; `updateSiteConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.updateSiteConfig }>
|
||||
|
||||
**`Deprecated`**
|
||||
|
||||
Use [parse](mermaid.Mermaid.md#parse) and [render](mermaid.Mermaid.md#render) instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
|
||||
|
||||
---
|
||||
|
||||
### parse
|
||||
|
||||
• **parse**: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)>
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`text`, `parseOptions`): `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>
|
||||
|
||||
Parse the text and validate the syntax.
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :------------- | :----------------------------------------------------------------------- | :------------------------------ |
|
||||
| `text` | `string` | The mermaid diagram definition. |
|
||||
| `parseOptions` | [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` } | Options for parsing. |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>
|
||||
|
||||
An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
|
||||
|
||||
**`See`**
|
||||
|
||||
[ParseOptions](mermaid.ParseOptions.md)
|
||||
|
||||
**`Throws`**
|
||||
|
||||
Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
|
||||
|
||||
▸ (`text`, `parseOptions?`): `Promise`<[`ParseResult`](mermaid.ParseResult.md)>
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :-------------- | :---------------------------------------- |
|
||||
| `text` | `string` |
|
||||
| `parseOptions?` | [`ParseOptions`](mermaid.ParseOptions.md) |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<[`ParseResult`](mermaid.ParseResult.md)>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
|
||||
|
||||
---
|
||||
|
||||
### parseError
|
||||
|
||||
• `Optional` **parseError**: [`ParseErrorFunction`](../modules/mermaid.md#parseerrorfunction)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L420)
|
||||
|
||||
---
|
||||
|
||||
### registerExternalDiagrams
|
||||
|
||||
• **registerExternalDiagrams**: (`diagrams`: [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[], `opts`: { `lazyLoad?`: `boolean` = true }) => `Promise`<`void`>
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`diagrams`, `opts?`): `Promise`<`void`>
|
||||
|
||||
Used to register external diagram types.
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Default value | Description |
|
||||
| :--------------- | :--------------------------------------------------------------------- | :------------ | :-------------------------------------------------------------------------- |
|
||||
| `diagrams` | [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[] | `undefined` | Array of [ExternalDiagramDefinition](mermaid.ExternalDiagramDefinition.md). |
|
||||
| `opts` | `Object` | `{}` | If opts.lazyLoad is false, the diagrams will be loaded immediately. |
|
||||
| `opts.lazyLoad?` | `boolean` | `true` | - |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434)
|
||||
|
||||
---
|
||||
|
||||
### registerIconPacks
|
||||
|
||||
• **registerIconPacks**: (`iconLoaders`: `IconLoader`\[]) => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`iconLoaders`): `void`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :------------ | :-------------- |
|
||||
| `iconLoaders` | `IconLoader`\[] |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439)
|
||||
|
||||
---
|
||||
|
||||
### registerLayoutLoaders
|
||||
|
||||
• **registerLayoutLoaders**: (`loaders`: [`LayoutLoaderDefinition`](mermaid.LayoutLoaderDefinition.md)\[]) => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`loaders`): `void`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :-------- | :--------------------------------------------------------------- |
|
||||
| `loaders` | [`LayoutLoaderDefinition`](mermaid.LayoutLoaderDefinition.md)\[] |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433)
|
||||
|
||||
---
|
||||
|
||||
### render
|
||||
|
||||
• **render**: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)>
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`id`, `text`, `svgContainingElement?`): `Promise`<[`RenderResult`](mermaid.RenderResult.md)>
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :---------------------- | :-------- |
|
||||
| `id` | `string` |
|
||||
| `text` | `string` |
|
||||
| `svgContainingElement?` | `Element` |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<[`RenderResult`](mermaid.RenderResult.md)>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427)
|
||||
|
||||
---
|
||||
|
||||
### run
|
||||
|
||||
• **run**: (`options`: [`RunOptions`](mermaid.RunOptions.md)) => `Promise`<`void`>
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`options?`): `Promise`<`void`>
|
||||
|
||||
## run
|
||||
|
||||
Function that goes through the document to find the chart definitions in there and render them.
|
||||
|
||||
The function tags the processed attributes with the attribute data-processed and ignores found
|
||||
elements with the attribute already set. This way the init function can be triggered several
|
||||
times.
|
||||
|
||||
```mermaid-example
|
||||
graph LR;
|
||||
a(Find elements)-->b{Processed}
|
||||
b-->|Yes|c(Leave element)
|
||||
b-->|No |d(Transform)
|
||||
```
|
||||
|
||||
```mermaid
|
||||
graph LR;
|
||||
a(Find elements)-->b{Processed}
|
||||
b-->|Yes|c(Leave element)
|
||||
b-->|No |d(Transform)
|
||||
```
|
||||
|
||||
Renders the mermaid diagrams
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :-------- | :------------------------------------ | :----------------------- |
|
||||
| `options` | [`RunOptions`](mermaid.RunOptions.md) | Optional runtime configs |
|
||||
|
||||
##### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432)
|
||||
|
||||
---
|
||||
|
||||
### setParseErrorHandler
|
||||
|
||||
• **setParseErrorHandler**: (`parseErrorHandler`: (`err`: `any`, `hash`: `any`) => `void`) => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`parseErrorHandler`): `void`
|
||||
|
||||
## setParseErrorHandler Alternative to directly setting parseError using:
|
||||
|
||||
```js
|
||||
mermaid.parseError = function (err, hash) {
|
||||
forExampleDisplayErrorInGui(err); // do something with the error
|
||||
};
|
||||
```
|
||||
|
||||
This is provided for environments where the mermaid object can't directly have a new member added
|
||||
to it (eg. dart interop wrapper). (Initially there is no parseError member of mermaid).
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :------------------ | :-------------------------------------- | :------------------------- |
|
||||
| `parseErrorHandler` | (`err`: `any`, `hash`: `any`) => `void` | New parseError() callback. |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
|
||||
|
||||
---
|
||||
|
||||
### startOnLoad
|
||||
|
||||
• **startOnLoad**: `boolean`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:419](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L419)
|
@@ -1,593 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md).
|
||||
|
||||
# Interface: MermaidConfig
|
||||
|
||||
[mermaid](../modules/mermaid.md).MermaidConfig
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [altFontFamily](mermaid.MermaidConfig.md#altfontfamily)
|
||||
- [architecture](mermaid.MermaidConfig.md#architecture)
|
||||
- [arrowMarkerAbsolute](mermaid.MermaidConfig.md#arrowmarkerabsolute)
|
||||
- [block](mermaid.MermaidConfig.md#block)
|
||||
- [c4](mermaid.MermaidConfig.md#c4)
|
||||
- [class](mermaid.MermaidConfig.md#class)
|
||||
- [darkMode](mermaid.MermaidConfig.md#darkmode)
|
||||
- [deterministicIDSeed](mermaid.MermaidConfig.md#deterministicidseed)
|
||||
- [deterministicIds](mermaid.MermaidConfig.md#deterministicids)
|
||||
- [dompurifyConfig](mermaid.MermaidConfig.md#dompurifyconfig)
|
||||
- [elk](mermaid.MermaidConfig.md#elk)
|
||||
- [er](mermaid.MermaidConfig.md#er)
|
||||
- [flowchart](mermaid.MermaidConfig.md#flowchart)
|
||||
- [fontFamily](mermaid.MermaidConfig.md#fontfamily)
|
||||
- [fontSize](mermaid.MermaidConfig.md#fontsize)
|
||||
- [forceLegacyMathML](mermaid.MermaidConfig.md#forcelegacymathml)
|
||||
- [gantt](mermaid.MermaidConfig.md#gantt)
|
||||
- [gitGraph](mermaid.MermaidConfig.md#gitgraph)
|
||||
- [handDrawnSeed](mermaid.MermaidConfig.md#handdrawnseed)
|
||||
- [htmlLabels](mermaid.MermaidConfig.md#htmllabels)
|
||||
- [journey](mermaid.MermaidConfig.md#journey)
|
||||
- [kanban](mermaid.MermaidConfig.md#kanban)
|
||||
- [layout](mermaid.MermaidConfig.md#layout)
|
||||
- [legacyMathML](mermaid.MermaidConfig.md#legacymathml)
|
||||
- [logLevel](mermaid.MermaidConfig.md#loglevel)
|
||||
- [look](mermaid.MermaidConfig.md#look)
|
||||
- [markdownAutoWrap](mermaid.MermaidConfig.md#markdownautowrap)
|
||||
- [maxEdges](mermaid.MermaidConfig.md#maxedges)
|
||||
- [maxTextSize](mermaid.MermaidConfig.md#maxtextsize)
|
||||
- [mindmap](mermaid.MermaidConfig.md#mindmap)
|
||||
- [packet](mermaid.MermaidConfig.md#packet)
|
||||
- [pie](mermaid.MermaidConfig.md#pie)
|
||||
- [quadrantChart](mermaid.MermaidConfig.md#quadrantchart)
|
||||
- [requirement](mermaid.MermaidConfig.md#requirement)
|
||||
- [sankey](mermaid.MermaidConfig.md#sankey)
|
||||
- [secure](mermaid.MermaidConfig.md#secure)
|
||||
- [securityLevel](mermaid.MermaidConfig.md#securitylevel)
|
||||
- [sequence](mermaid.MermaidConfig.md#sequence)
|
||||
- [startOnLoad](mermaid.MermaidConfig.md#startonload)
|
||||
- [state](mermaid.MermaidConfig.md#state)
|
||||
- [suppressErrorRendering](mermaid.MermaidConfig.md#suppresserrorrendering)
|
||||
- [theme](mermaid.MermaidConfig.md#theme)
|
||||
- [themeCSS](mermaid.MermaidConfig.md#themecss)
|
||||
- [themeVariables](mermaid.MermaidConfig.md#themevariables)
|
||||
- [timeline](mermaid.MermaidConfig.md#timeline)
|
||||
- [wrap](mermaid.MermaidConfig.md#wrap)
|
||||
- [xyChart](mermaid.MermaidConfig.md#xychart)
|
||||
|
||||
## Properties
|
||||
|
||||
### altFontFamily
|
||||
|
||||
• `Optional` **altFontFamily**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:122](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L122)
|
||||
|
||||
---
|
||||
|
||||
### architecture
|
||||
|
||||
• `Optional` **architecture**: `ArchitectureDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:194](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L194)
|
||||
|
||||
---
|
||||
|
||||
### arrowMarkerAbsolute
|
||||
|
||||
• `Optional` **arrowMarkerAbsolute**: `boolean`
|
||||
|
||||
Controls whether or arrow markers in html code are absolute paths or anchors.
|
||||
This matters if you are using base tag settings.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:141](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L141)
|
||||
|
||||
---
|
||||
|
||||
### block
|
||||
|
||||
• `Optional` **block**: `BlockDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:201](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L201)
|
||||
|
||||
---
|
||||
|
||||
### c4
|
||||
|
||||
• `Optional` **c4**: `C4DiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:198](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L198)
|
||||
|
||||
---
|
||||
|
||||
### class
|
||||
|
||||
• `Optional` **class**: `ClassDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:187](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L187)
|
||||
|
||||
---
|
||||
|
||||
### darkMode
|
||||
|
||||
• `Optional` **darkMode**: `boolean`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L113)
|
||||
|
||||
---
|
||||
|
||||
### deterministicIDSeed
|
||||
|
||||
• `Optional` **deterministicIDSeed**: `string`
|
||||
|
||||
This option is the optional seed for deterministic ids.
|
||||
If set to `undefined` but deterministicIds is `true`, a simple number iterator is used.
|
||||
You can set this attribute to base the seed on a static string.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:181](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L181)
|
||||
|
||||
---
|
||||
|
||||
### deterministicIds
|
||||
|
||||
• `Optional` **deterministicIds**: `boolean`
|
||||
|
||||
This option controls if the generated ids of nodes in the SVG are
|
||||
generated randomly or based on a seed.
|
||||
If set to `false`, the IDs are generated based on the current date and
|
||||
thus are not deterministic. This is the default behavior.
|
||||
|
||||
This matters if your files are checked into source control e.g. git and
|
||||
should not change unless content is changed.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:174](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L174)
|
||||
|
||||
---
|
||||
|
||||
### dompurifyConfig
|
||||
|
||||
• `Optional` **dompurifyConfig**: `Config`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:202](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L202)
|
||||
|
||||
---
|
||||
|
||||
### elk
|
||||
|
||||
• `Optional` **elk**: `Object`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
| Name | Type | Description |
|
||||
| :----------------------- | :-------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `cycleBreakingStrategy?` | `"GREEDY"` \| `"DEPTH_FIRST"` \| `"INTERACTIVE"` \| `"MODEL_ORDER"` \| `"GREEDY_MODEL_ORDER"` | This strategy decides how to find cycles in the graph and deciding which edges need adjustment to break loops. |
|
||||
| `mergeEdges?` | `boolean` | Elk specific option that allows edges to share path where it convenient. It can make for pretty diagrams but can also make it harder to read the diagram. |
|
||||
| `nodePlacementStrategy?` | `"SIMPLE"` \| `"NETWORK_SIMPLEX"` \| `"LINEAR_SEGMENTS"` \| `"BRANDES_KOEPF"` | Elk specific option affecting how nodes are placed. |
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:91](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L91)
|
||||
|
||||
---
|
||||
|
||||
### er
|
||||
|
||||
• `Optional` **er**: `ErDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:189](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L189)
|
||||
|
||||
---
|
||||
|
||||
### flowchart
|
||||
|
||||
• `Optional` **flowchart**: `FlowchartDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:182](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L182)
|
||||
|
||||
---
|
||||
|
||||
### fontFamily
|
||||
|
||||
• `Optional` **fontFamily**: `string`
|
||||
|
||||
Specifies the font to be used in the rendered diagrams.
|
||||
Can be any possible CSS `font-family`.
|
||||
See <https://developer.mozilla.org/en-US/docs/Web/CSS/font-family>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:121](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L121)
|
||||
|
||||
---
|
||||
|
||||
### fontSize
|
||||
|
||||
• `Optional` **fontSize**: `number`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:204](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L204)
|
||||
|
||||
---
|
||||
|
||||
### forceLegacyMathML
|
||||
|
||||
• `Optional` **forceLegacyMathML**: `boolean`
|
||||
|
||||
This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS
|
||||
fonts and browser's MathML implementation, this option is recommended if consistent rendering is important.
|
||||
If set to true, ignores legacyMathML.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:163](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L163)
|
||||
|
||||
---
|
||||
|
||||
### gantt
|
||||
|
||||
• `Optional` **gantt**: `GanttDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:184](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L184)
|
||||
|
||||
---
|
||||
|
||||
### gitGraph
|
||||
|
||||
• `Optional` **gitGraph**: `GitGraphDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:197](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L197)
|
||||
|
||||
---
|
||||
|
||||
### handDrawnSeed
|
||||
|
||||
• `Optional` **handDrawnSeed**: `number`
|
||||
|
||||
Defines the seed to be used when using handDrawn look. This is important for the automated tests as they will always find differences without the seed. The default value is 0 which gives a random seed.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:76](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L76)
|
||||
|
||||
---
|
||||
|
||||
### htmlLabels
|
||||
|
||||
• `Optional` **htmlLabels**: `boolean`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:114](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L114)
|
||||
|
||||
---
|
||||
|
||||
### journey
|
||||
|
||||
• `Optional` **journey**: `JourneyDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:185](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L185)
|
||||
|
||||
---
|
||||
|
||||
### kanban
|
||||
|
||||
• `Optional` **kanban**: `KanbanDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:196](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L196)
|
||||
|
||||
---
|
||||
|
||||
### layout
|
||||
|
||||
• `Optional` **layout**: `string`
|
||||
|
||||
Defines which layout algorithm to use for rendering the diagram.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L81)
|
||||
|
||||
---
|
||||
|
||||
### legacyMathML
|
||||
|
||||
• `Optional` **legacyMathML**: `boolean`
|
||||
|
||||
This option specifies if Mermaid can expect the dependent to include KaTeX stylesheets for browsers
|
||||
without their own MathML implementation. If this option is disabled and MathML is not supported, the math
|
||||
equations are replaced with a warning. If this option is enabled and MathML is not supported, Mermaid will
|
||||
fall back to legacy rendering for KaTeX.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L156)
|
||||
|
||||
---
|
||||
|
||||
### logLevel
|
||||
|
||||
• `Optional` **logLevel**: `0` | `2` | `1` | `"trace"` | `"debug"` | `"info"` | `"warn"` | `"error"` | `"fatal"` | `3` | `4` | `5`
|
||||
|
||||
This option decides the amount of logging to be used by mermaid.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:127](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L127)
|
||||
|
||||
---
|
||||
|
||||
### look
|
||||
|
||||
• `Optional` **look**: `"classic"` | `"handDrawn"`
|
||||
|
||||
Defines which main look to use for the diagram.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L71)
|
||||
|
||||
---
|
||||
|
||||
### markdownAutoWrap
|
||||
|
||||
• `Optional` **markdownAutoWrap**: `boolean`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:205](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L205)
|
||||
|
||||
---
|
||||
|
||||
### maxEdges
|
||||
|
||||
• `Optional` **maxEdges**: `number`
|
||||
|
||||
Defines the maximum number of edges that can be drawn in a graph.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L90)
|
||||
|
||||
---
|
||||
|
||||
### maxTextSize
|
||||
|
||||
• `Optional` **maxTextSize**: `number`
|
||||
|
||||
The maximum allowed size of the users text diagram
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L85)
|
||||
|
||||
---
|
||||
|
||||
### mindmap
|
||||
|
||||
• `Optional` **mindmap**: `MindmapDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:195](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L195)
|
||||
|
||||
---
|
||||
|
||||
### packet
|
||||
|
||||
• `Optional` **packet**: `PacketDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L200)
|
||||
|
||||
---
|
||||
|
||||
### pie
|
||||
|
||||
• `Optional` **pie**: `PieDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:190](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L190)
|
||||
|
||||
---
|
||||
|
||||
### quadrantChart
|
||||
|
||||
• `Optional` **quadrantChart**: `QuadrantChartConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:191](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L191)
|
||||
|
||||
---
|
||||
|
||||
### requirement
|
||||
|
||||
• `Optional` **requirement**: `RequirementDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:193](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L193)
|
||||
|
||||
---
|
||||
|
||||
### sankey
|
||||
|
||||
• `Optional` **sankey**: `SankeyDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L199)
|
||||
|
||||
---
|
||||
|
||||
### secure
|
||||
|
||||
• `Optional` **secure**: `string`\[]
|
||||
|
||||
This option controls which `currentConfig` keys are considered secure and
|
||||
can only be changed via call to `mermaid.initialize`.
|
||||
This prevents malicious graph directives from overriding a site's default security.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L148)
|
||||
|
||||
---
|
||||
|
||||
### securityLevel
|
||||
|
||||
• `Optional` **securityLevel**: `"strict"` | `"loose"` | `"antiscript"` | `"sandbox"`
|
||||
|
||||
Level of trust for parsed diagram
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L131)
|
||||
|
||||
---
|
||||
|
||||
### sequence
|
||||
|
||||
• `Optional` **sequence**: `SequenceDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:183](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L183)
|
||||
|
||||
---
|
||||
|
||||
### startOnLoad
|
||||
|
||||
• `Optional` **startOnLoad**: `boolean`
|
||||
|
||||
Dictates whether mermaid starts on Page load
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L135)
|
||||
|
||||
---
|
||||
|
||||
### state
|
||||
|
||||
• `Optional` **state**: `StateDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L188)
|
||||
|
||||
---
|
||||
|
||||
### suppressErrorRendering
|
||||
|
||||
• `Optional` **suppressErrorRendering**: `boolean`
|
||||
|
||||
Suppresses inserting 'Syntax error' diagram in the DOM.
|
||||
This is useful when you want to control how to handle syntax errors in your application.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:211](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L211)
|
||||
|
||||
---
|
||||
|
||||
### theme
|
||||
|
||||
• `Optional` **theme**: `"default"` | `"base"` | `"dark"` | `"forest"` | `"neutral"` | `"null"`
|
||||
|
||||
Theme, the CSS style sheet.
|
||||
You may also use `themeCSS` to override this value.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L64)
|
||||
|
||||
---
|
||||
|
||||
### themeCSS
|
||||
|
||||
• `Optional` **themeCSS**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:66](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L66)
|
||||
|
||||
---
|
||||
|
||||
### themeVariables
|
||||
|
||||
• `Optional` **themeVariables**: `any`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L65)
|
||||
|
||||
---
|
||||
|
||||
### timeline
|
||||
|
||||
• `Optional` **timeline**: `TimelineDiagramConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:186](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L186)
|
||||
|
||||
---
|
||||
|
||||
### wrap
|
||||
|
||||
• `Optional` **wrap**: `boolean`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:203](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L203)
|
||||
|
||||
---
|
||||
|
||||
### xyChart
|
||||
|
||||
• `Optional` **xyChart**: `XYChartConfig`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.type.ts:192](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L192)
|
@@ -1,28 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md).
|
||||
|
||||
# Interface: ParseOptions
|
||||
|
||||
[mermaid](../modules/mermaid.md).ParseOptions
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [suppressErrors](mermaid.ParseOptions.md#suppresserrors)
|
||||
|
||||
## Properties
|
||||
|
||||
### suppressErrors
|
||||
|
||||
• `Optional` **suppressErrors**: `boolean`
|
||||
|
||||
If `true`, parse will return `false` instead of throwing error when the diagram is invalid.
|
||||
The `parseError` function will not be called.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L64)
|
@@ -1,40 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md).
|
||||
|
||||
# Interface: ParseResult
|
||||
|
||||
[mermaid](../modules/mermaid.md).ParseResult
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [config](mermaid.ParseResult.md#config)
|
||||
- [diagramType](mermaid.ParseResult.md#diagramtype)
|
||||
|
||||
## Properties
|
||||
|
||||
### config
|
||||
|
||||
• **config**: [`MermaidConfig`](mermaid.MermaidConfig.md)
|
||||
|
||||
The config passed as YAML frontmatter or directives
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L75)
|
||||
|
||||
---
|
||||
|
||||
### diagramType
|
||||
|
||||
• **diagramType**: `string`
|
||||
|
||||
The diagram type, e.g. 'flowchart', 'sequence', etc.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L71)
|
@@ -1,25 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderOptions.md).
|
||||
|
||||
# Interface: RenderOptions
|
||||
|
||||
[mermaid](../modules/mermaid.md).RenderOptions
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [algorithm](mermaid.RenderOptions.md#algorithm)
|
||||
|
||||
## Properties
|
||||
|
||||
### algorithm
|
||||
|
||||
• `Optional` **algorithm**: `string`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/rendering-util/render.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L8)
|
@@ -1,74 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md).
|
||||
|
||||
# Interface: RenderResult
|
||||
|
||||
[mermaid](../modules/mermaid.md).RenderResult
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [bindFunctions](mermaid.RenderResult.md#bindfunctions)
|
||||
- [diagramType](mermaid.RenderResult.md#diagramtype)
|
||||
- [svg](mermaid.RenderResult.md#svg)
|
||||
|
||||
## Properties
|
||||
|
||||
### bindFunctions
|
||||
|
||||
• `Optional` **bindFunctions**: (`element`: `Element`) => `void`
|
||||
|
||||
Bind function to be called after the svg has been inserted into the DOM.
|
||||
This is necessary for adding event listeners to the elements in the svg.
|
||||
|
||||
```js
|
||||
const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B');
|
||||
div.innerHTML = svg;
|
||||
bindFunctions?.(div); // To call bindFunctions only if it's present.
|
||||
```
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`element`): `void`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :-------- | :-------- |
|
||||
| `element` | `Element` |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L103)
|
||||
|
||||
---
|
||||
|
||||
### diagramType
|
||||
|
||||
• **diagramType**: `string`
|
||||
|
||||
The diagram type, e.g. 'flowchart', 'sequence', etc.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:93](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L93)
|
||||
|
||||
---
|
||||
|
||||
### svg
|
||||
|
||||
• **svg**: `string`
|
||||
|
||||
The svg code for the rendered graph.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89)
|
@@ -1,80 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md).
|
||||
|
||||
# Interface: RunOptions
|
||||
|
||||
[mermaid](../modules/mermaid.md).RunOptions
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Properties
|
||||
|
||||
- [nodes](mermaid.RunOptions.md#nodes)
|
||||
- [postRenderCallback](mermaid.RunOptions.md#postrendercallback)
|
||||
- [querySelector](mermaid.RunOptions.md#queryselector)
|
||||
- [suppressErrors](mermaid.RunOptions.md#suppresserrors)
|
||||
|
||||
## Properties
|
||||
|
||||
### nodes
|
||||
|
||||
• `Optional` **nodes**: `ArrayLike`<`HTMLElement`>
|
||||
|
||||
The nodes to render. If this is set, `querySelector` will be ignored.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
|
||||
|
||||
---
|
||||
|
||||
### postRenderCallback
|
||||
|
||||
• `Optional` **postRenderCallback**: (`id`: `string`) => `unknown`
|
||||
|
||||
A callback to call after each diagram is rendered.
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`id`): `unknown`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :--- | :------- |
|
||||
| `id` | `string` |
|
||||
|
||||
##### Returns
|
||||
|
||||
`unknown`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
|
||||
|
||||
---
|
||||
|
||||
### querySelector
|
||||
|
||||
• `Optional` **querySelector**: `string`
|
||||
|
||||
The query selector to use when finding elements to render. Default: `".mermaid"`.
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
|
||||
|
||||
---
|
||||
|
||||
### suppressErrors
|
||||
|
||||
• `Optional` **suppressErrors**: `boolean`
|
||||
|
||||
If `true`, errors will be logged to the console, but not thrown. Default: `false`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
|
40
docs/config/setup/mermaid/README.md
Normal file
40
docs/config/setup/mermaid/README.md
Normal file
@@ -0,0 +1,40 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/README.md](../../../../packages/mermaid/src/docs/config/setup/mermaid/README.md).
|
||||
|
||||
[**mermaid**](../README.md)
|
||||
|
||||
---
|
||||
|
||||
# mermaid
|
||||
|
||||
## Classes
|
||||
|
||||
- [UnknownDiagramError](classes/UnknownDiagramError.md)
|
||||
|
||||
## Interfaces
|
||||
|
||||
- [DetailedError](interfaces/DetailedError.md)
|
||||
- [ExternalDiagramDefinition](interfaces/ExternalDiagramDefinition.md)
|
||||
- [LayoutData](interfaces/LayoutData.md)
|
||||
- [LayoutLoaderDefinition](interfaces/LayoutLoaderDefinition.md)
|
||||
- [Mermaid](interfaces/Mermaid.md)
|
||||
- [MermaidConfig](interfaces/MermaidConfig.md)
|
||||
- [ParseOptions](interfaces/ParseOptions.md)
|
||||
- [ParseResult](interfaces/ParseResult.md)
|
||||
- [RenderOptions](interfaces/RenderOptions.md)
|
||||
- [RenderResult](interfaces/RenderResult.md)
|
||||
- [RunOptions](interfaces/RunOptions.md)
|
||||
|
||||
## Type Aliases
|
||||
|
||||
- [InternalHelpers](type-aliases/InternalHelpers.md)
|
||||
- [ParseErrorFunction](type-aliases/ParseErrorFunction.md)
|
||||
- [SVG](type-aliases/SVG.md)
|
||||
- [SVGGroup](type-aliases/SVGGroup.md)
|
||||
|
||||
## Variables
|
||||
|
||||
- [default](variables/default.md)
|
159
docs/config/setup/mermaid/classes/UnknownDiagramError.md
Normal file
159
docs/config/setup/mermaid/classes/UnknownDiagramError.md
Normal file
@@ -0,0 +1,159 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/classes/UnknownDiagramError.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/classes/UnknownDiagramError.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Class: UnknownDiagramError
|
||||
|
||||
Defined in: [packages/mermaid/src/errors.ts:1](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L1)
|
||||
|
||||
## Extends
|
||||
|
||||
- `Error`
|
||||
|
||||
## Constructors
|
||||
|
||||
### new UnknownDiagramError()
|
||||
|
||||
> **new UnknownDiagramError**(`message`): [`UnknownDiagramError`](UnknownDiagramError.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/errors.ts:2](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L2)
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### message
|
||||
|
||||
`string`
|
||||
|
||||
#### Returns
|
||||
|
||||
[`UnknownDiagramError`](UnknownDiagramError.md)
|
||||
|
||||
#### Overrides
|
||||
|
||||
`Error.constructor`
|
||||
|
||||
## Properties
|
||||
|
||||
### cause?
|
||||
|
||||
> `optional` **cause**: `unknown`
|
||||
|
||||
Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es2022.error.d.ts:26
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.cause`
|
||||
|
||||
---
|
||||
|
||||
### message
|
||||
|
||||
> **message**: `string`
|
||||
|
||||
Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1077
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.message`
|
||||
|
||||
---
|
||||
|
||||
### name
|
||||
|
||||
> **name**: `string`
|
||||
|
||||
Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1076
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.name`
|
||||
|
||||
---
|
||||
|
||||
### stack?
|
||||
|
||||
> `optional` **stack**: `string`
|
||||
|
||||
Defined in: node_modules/.pnpm/typescript\@5.7.3/node_modules/typescript/lib/lib.es5.d.ts:1078
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.stack`
|
||||
|
||||
---
|
||||
|
||||
### prepareStackTrace()?
|
||||
|
||||
> `static` `optional` **prepareStackTrace**: (`err`, `stackTraces`) => `any`
|
||||
|
||||
Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:143
|
||||
|
||||
Optional override for formatting stack traces
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### err
|
||||
|
||||
`Error`
|
||||
|
||||
##### stackTraces
|
||||
|
||||
`CallSite`\[]
|
||||
|
||||
#### Returns
|
||||
|
||||
`any`
|
||||
|
||||
#### See
|
||||
|
||||
<https://v8.dev/docs/stack-trace-api#customizing-stack-traces>
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.prepareStackTrace`
|
||||
|
||||
---
|
||||
|
||||
### stackTraceLimit
|
||||
|
||||
> `static` **stackTraceLimit**: `number`
|
||||
|
||||
Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:145
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.stackTraceLimit`
|
||||
|
||||
## Methods
|
||||
|
||||
### captureStackTrace()
|
||||
|
||||
> `static` **captureStackTrace**(`targetObject`, `constructorOpt`?): `void`
|
||||
|
||||
Defined in: node_modules/.pnpm/@types+node\@22.13.5/node_modules/@types/node/globals.d.ts:136
|
||||
|
||||
Create .stack property on a target object
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### targetObject
|
||||
|
||||
`object`
|
||||
|
||||
##### constructorOpt?
|
||||
|
||||
`Function`
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Inherited from
|
||||
|
||||
`Error.captureStackTrace`
|
45
docs/config/setup/mermaid/interfaces/DetailedError.md
Normal file
45
docs/config/setup/mermaid/interfaces/DetailedError.md
Normal file
@@ -0,0 +1,45 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/DetailedError.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/DetailedError.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: DetailedError
|
||||
|
||||
Defined in: [packages/mermaid/src/utils.ts:783](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L783)
|
||||
|
||||
## Properties
|
||||
|
||||
### error?
|
||||
|
||||
> `optional` **error**: `any`
|
||||
|
||||
Defined in: [packages/mermaid/src/utils.ts:788](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L788)
|
||||
|
||||
---
|
||||
|
||||
### hash
|
||||
|
||||
> **hash**: `any`
|
||||
|
||||
Defined in: [packages/mermaid/src/utils.ts:786](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L786)
|
||||
|
||||
---
|
||||
|
||||
### message?
|
||||
|
||||
> `optional` **message**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/utils.ts:789](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L789)
|
||||
|
||||
---
|
||||
|
||||
### str
|
||||
|
||||
> **str**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/utils.ts:784](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L784)
|
@@ -0,0 +1,37 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ExternalDiagramDefinition.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: ExternalDiagramDefinition
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:99](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L99)
|
||||
|
||||
## Properties
|
||||
|
||||
### detector
|
||||
|
||||
> **detector**: `DiagramDetector`
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
|
||||
|
||||
---
|
||||
|
||||
### id
|
||||
|
||||
> **id**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
|
||||
|
||||
---
|
||||
|
||||
### loader
|
||||
|
||||
> **loader**: `DiagramLoader`
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)
|
41
docs/config/setup/mermaid/interfaces/LayoutData.md
Normal file
41
docs/config/setup/mermaid/interfaces/LayoutData.md
Normal file
@@ -0,0 +1,41 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutData.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutData.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: LayoutData
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/types.ts:145](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L145)
|
||||
|
||||
## Indexable
|
||||
|
||||
\[`key`: `string`]: `any`
|
||||
|
||||
## Properties
|
||||
|
||||
### config
|
||||
|
||||
> **config**: [`MermaidConfig`](MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/types.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L148)
|
||||
|
||||
---
|
||||
|
||||
### edges
|
||||
|
||||
> **edges**: `Edge`\[]
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/types.ts:147](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L147)
|
||||
|
||||
---
|
||||
|
||||
### nodes
|
||||
|
||||
> **nodes**: `Node`\[]
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/types.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/types.ts#L146)
|
@@ -0,0 +1,37 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/LayoutLoaderDefinition.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: LayoutLoaderDefinition
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:21](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L21)
|
||||
|
||||
## Properties
|
||||
|
||||
### algorithm?
|
||||
|
||||
> `optional` **algorithm**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:24](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L24)
|
||||
|
||||
---
|
||||
|
||||
### loader
|
||||
|
||||
> **loader**: `LayoutLoader`
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:23](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L23)
|
||||
|
||||
---
|
||||
|
||||
### name
|
||||
|
||||
> **name**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:22](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L22)
|
427
docs/config/setup/mermaid/interfaces/Mermaid.md
Normal file
427
docs/config/setup/mermaid/interfaces/Mermaid.md
Normal file
@@ -0,0 +1,427 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/Mermaid.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/Mermaid.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: Mermaid
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:418](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L418)
|
||||
|
||||
## Properties
|
||||
|
||||
### contentLoaded()
|
||||
|
||||
> **contentLoaded**: () => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:436](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L436)
|
||||
|
||||
\##contentLoaded Callback function that is called when page is loaded. This functions fetches
|
||||
configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the
|
||||
page.
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### detectType()
|
||||
|
||||
> **detectType**: (`text`, `config`?) => `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:438](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L438)
|
||||
|
||||
Detects the type of the graph text.
|
||||
|
||||
Takes into consideration the possible existence of an `%%init` directive
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### text
|
||||
|
||||
`string`
|
||||
|
||||
The text defining the graph. For example:
|
||||
|
||||
```mermaid-example
|
||||
%%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%%
|
||||
graph LR
|
||||
a-->b
|
||||
b-->c
|
||||
c-->d
|
||||
d-->e
|
||||
e-->f
|
||||
f-->g
|
||||
g-->h
|
||||
```
|
||||
|
||||
```mermaid
|
||||
%%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%%
|
||||
graph LR
|
||||
a-->b
|
||||
b-->c
|
||||
c-->d
|
||||
d-->e
|
||||
e-->f
|
||||
f-->g
|
||||
g-->h
|
||||
```
|
||||
|
||||
##### config?
|
||||
|
||||
[`MermaidConfig`](MermaidConfig.md)
|
||||
|
||||
The mermaid config.
|
||||
|
||||
#### Returns
|
||||
|
||||
`string`
|
||||
|
||||
A graph definition key
|
||||
|
||||
---
|
||||
|
||||
### ~~init()~~
|
||||
|
||||
> **init**: (`config`?, `nodes`?, `callback`?) => `Promise`<`void`>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:431](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L431)
|
||||
|
||||
## init
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### config?
|
||||
|
||||
[`MermaidConfig`](MermaidConfig.md)
|
||||
|
||||
**Deprecated**, please set configuration in [initialize](Mermaid.md#initialize).
|
||||
|
||||
##### nodes?
|
||||
|
||||
**Default**: `.mermaid`. One of the following:
|
||||
|
||||
- A DOM Node
|
||||
- An array of DOM nodes (as would come from a jQuery selector)
|
||||
- A W3C selector, a la `.mermaid`
|
||||
|
||||
`string` | `HTMLElement` | `NodeListOf`<`HTMLElement`>
|
||||
|
||||
##### callback?
|
||||
|
||||
(`id`) => `unknown`
|
||||
|
||||
Called once for each rendered diagram's id.
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
#### Deprecated
|
||||
|
||||
Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
|
||||
|
||||
Renders the mermaid diagrams
|
||||
|
||||
#### Deprecated
|
||||
|
||||
Use [initialize](Mermaid.md#initialize) and [run](Mermaid.md#run) instead.
|
||||
|
||||
---
|
||||
|
||||
### initialize()
|
||||
|
||||
> **initialize**: (`config`) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:435](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L435)
|
||||
|
||||
Used to set configurations for mermaid.
|
||||
This function should be called before the run function.
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### config
|
||||
|
||||
[`MermaidConfig`](MermaidConfig.md)
|
||||
|
||||
Configuration object for mermaid.
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### ~~mermaidAPI~~
|
||||
|
||||
> **mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](MermaidConfig.md); `getConfig`: () => [`MermaidConfig`](MermaidConfig.md); `getDiagramFromText`: (`text`, `metadata`) => `Promise`<`Diagram`>; `getSiteConfig`: () => [`MermaidConfig`](MermaidConfig.md); `globalReset`: () => `void`; `initialize`: (`userOptions`) => `void`; `parse`: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>; `render`: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>; `reset`: () => `void`; `setConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); `updateSiteConfig`: (`conf`) => [`MermaidConfig`](MermaidConfig.md); }>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
|
||||
|
||||
**`Internal`**
|
||||
|
||||
#### Deprecated
|
||||
|
||||
Use [parse](Mermaid.md#parse) and [render](Mermaid.md#render) instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
|
||||
|
||||
---
|
||||
|
||||
### parse()
|
||||
|
||||
> **parse**: (`text`, `parseOptions`) => `Promise`<`false` | [`ParseResult`](ParseResult.md)>(`text`, `parseOptions`?) => `Promise`<[`ParseResult`](ParseResult.md)>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
|
||||
|
||||
Parse the text and validate the syntax.
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### text
|
||||
|
||||
`string`
|
||||
|
||||
The mermaid diagram definition.
|
||||
|
||||
##### parseOptions
|
||||
|
||||
[`ParseOptions`](ParseOptions.md) & `object`
|
||||
|
||||
Options for parsing.
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<`false` | [`ParseResult`](ParseResult.md)>
|
||||
|
||||
An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
|
||||
|
||||
#### See
|
||||
|
||||
[ParseOptions](ParseOptions.md)
|
||||
|
||||
#### Throws
|
||||
|
||||
Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
|
||||
|
||||
Parse the text and validate the syntax.
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### text
|
||||
|
||||
`string`
|
||||
|
||||
The mermaid diagram definition.
|
||||
|
||||
##### parseOptions?
|
||||
|
||||
[`ParseOptions`](ParseOptions.md)
|
||||
|
||||
Options for parsing.
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<[`ParseResult`](ParseResult.md)>
|
||||
|
||||
An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
|
||||
|
||||
#### See
|
||||
|
||||
[ParseOptions](ParseOptions.md)
|
||||
|
||||
#### Throws
|
||||
|
||||
Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
|
||||
|
||||
---
|
||||
|
||||
### parseError?
|
||||
|
||||
> `optional` **parseError**: [`ParseErrorFunction`](../type-aliases/ParseErrorFunction.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:420](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L420)
|
||||
|
||||
---
|
||||
|
||||
### registerExternalDiagrams()
|
||||
|
||||
> **registerExternalDiagrams**: (`diagrams`, `opts`) => `Promise`<`void`>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:434](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L434)
|
||||
|
||||
Used to register external diagram types.
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### diagrams
|
||||
|
||||
[`ExternalDiagramDefinition`](ExternalDiagramDefinition.md)\[]
|
||||
|
||||
Array of [ExternalDiagramDefinition](ExternalDiagramDefinition.md).
|
||||
|
||||
##### opts
|
||||
|
||||
If opts.lazyLoad is false, the diagrams will be loaded immediately.
|
||||
|
||||
###### lazyLoad?
|
||||
|
||||
`boolean` = `true`
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
---
|
||||
|
||||
### registerIconPacks()
|
||||
|
||||
> **registerIconPacks**: (`iconLoaders`) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:439](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L439)
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### iconLoaders
|
||||
|
||||
`IconLoader`\[]
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### registerLayoutLoaders()
|
||||
|
||||
> **registerLayoutLoaders**: (`loaders`) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:433](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L433)
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### loaders
|
||||
|
||||
[`LayoutLoaderDefinition`](LayoutLoaderDefinition.md)\[]
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### render()
|
||||
|
||||
> **render**: (`id`, `text`, `svgContainingElement`?) => `Promise`<[`RenderResult`](RenderResult.md)>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427)
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### id
|
||||
|
||||
`string`
|
||||
|
||||
##### text
|
||||
|
||||
`string`
|
||||
|
||||
##### svgContainingElement?
|
||||
|
||||
`Element`
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<[`RenderResult`](RenderResult.md)>
|
||||
|
||||
#### Deprecated
|
||||
|
||||
- use the `mermaid.render` function instead of `mermaid.mermaidAPI.render`
|
||||
|
||||
Deprecated for external use.
|
||||
|
||||
---
|
||||
|
||||
### run()
|
||||
|
||||
> **run**: (`options`) => `Promise`<`void`>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:432](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L432)
|
||||
|
||||
## run
|
||||
|
||||
Function that goes through the document to find the chart definitions in there and render them.
|
||||
|
||||
The function tags the processed attributes with the attribute data-processed and ignores found
|
||||
elements with the attribute already set. This way the init function can be triggered several
|
||||
times.
|
||||
|
||||
```mermaid-example
|
||||
graph LR;
|
||||
a(Find elements)-->b{Processed}
|
||||
b-->|Yes|c(Leave element)
|
||||
b-->|No |d(Transform)
|
||||
```
|
||||
|
||||
```mermaid
|
||||
graph LR;
|
||||
a(Find elements)-->b{Processed}
|
||||
b-->|Yes|c(Leave element)
|
||||
b-->|No |d(Transform)
|
||||
```
|
||||
|
||||
Renders the mermaid diagrams
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### options
|
||||
|
||||
[`RunOptions`](RunOptions.md) = `...`
|
||||
|
||||
Optional runtime configs
|
||||
|
||||
#### Returns
|
||||
|
||||
`Promise`<`void`>
|
||||
|
||||
---
|
||||
|
||||
### setParseErrorHandler()
|
||||
|
||||
> **setParseErrorHandler**: (`parseErrorHandler`) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:437](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L437)
|
||||
|
||||
## setParseErrorHandler Alternative to directly setting parseError using:
|
||||
|
||||
```js
|
||||
mermaid.parseError = function (err, hash) {
|
||||
forExampleDisplayErrorInGui(err); // do something with the error
|
||||
};
|
||||
```
|
||||
|
||||
This is provided for environments where the mermaid object can't directly have a new member added
|
||||
to it (eg. dart interop wrapper). (Initially there is no parseError member of mermaid).
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### parseErrorHandler
|
||||
|
||||
(`err`, `hash`) => `void`
|
||||
|
||||
New parseError() callback.
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### startOnLoad
|
||||
|
||||
> **startOnLoad**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:419](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L419)
|
469
docs/config/setup/mermaid/interfaces/MermaidConfig.md
Normal file
469
docs/config/setup/mermaid/interfaces/MermaidConfig.md
Normal file
@@ -0,0 +1,469 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/MermaidConfig.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/MermaidConfig.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: MermaidConfig
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:58](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L58)
|
||||
|
||||
## Properties
|
||||
|
||||
### altFontFamily?
|
||||
|
||||
> `optional` **altFontFamily**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:122](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L122)
|
||||
|
||||
---
|
||||
|
||||
### architecture?
|
||||
|
||||
> `optional` **architecture**: `ArchitectureDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:194](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L194)
|
||||
|
||||
---
|
||||
|
||||
### arrowMarkerAbsolute?
|
||||
|
||||
> `optional` **arrowMarkerAbsolute**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:141](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L141)
|
||||
|
||||
Controls whether or arrow markers in html code are absolute paths or anchors.
|
||||
This matters if you are using base tag settings.
|
||||
|
||||
---
|
||||
|
||||
### block?
|
||||
|
||||
> `optional` **block**: `BlockDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:201](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L201)
|
||||
|
||||
---
|
||||
|
||||
### c4?
|
||||
|
||||
> `optional` **c4**: `C4DiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:198](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L198)
|
||||
|
||||
---
|
||||
|
||||
### class?
|
||||
|
||||
> `optional` **class**: `ClassDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:187](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L187)
|
||||
|
||||
---
|
||||
|
||||
### darkMode?
|
||||
|
||||
> `optional` **darkMode**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L113)
|
||||
|
||||
---
|
||||
|
||||
### deterministicIds?
|
||||
|
||||
> `optional` **deterministicIds**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:174](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L174)
|
||||
|
||||
This option controls if the generated ids of nodes in the SVG are
|
||||
generated randomly or based on a seed.
|
||||
If set to `false`, the IDs are generated based on the current date and
|
||||
thus are not deterministic. This is the default behavior.
|
||||
|
||||
This matters if your files are checked into source control e.g. git and
|
||||
should not change unless content is changed.
|
||||
|
||||
---
|
||||
|
||||
### deterministicIDSeed?
|
||||
|
||||
> `optional` **deterministicIDSeed**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:181](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L181)
|
||||
|
||||
This option is the optional seed for deterministic ids.
|
||||
If set to `undefined` but deterministicIds is `true`, a simple number iterator is used.
|
||||
You can set this attribute to base the seed on a static string.
|
||||
|
||||
---
|
||||
|
||||
### dompurifyConfig?
|
||||
|
||||
> `optional` **dompurifyConfig**: `Config`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:203](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L203)
|
||||
|
||||
---
|
||||
|
||||
### elk?
|
||||
|
||||
> `optional` **elk**: `object`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:91](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L91)
|
||||
|
||||
#### cycleBreakingStrategy?
|
||||
|
||||
> `optional` **cycleBreakingStrategy**: `"GREEDY"` | `"DEPTH_FIRST"` | `"INTERACTIVE"` | `"MODEL_ORDER"` | `"GREEDY_MODEL_ORDER"`
|
||||
|
||||
This strategy decides how to find cycles in the graph and deciding which edges need adjustment to break loops.
|
||||
|
||||
#### mergeEdges?
|
||||
|
||||
> `optional` **mergeEdges**: `boolean`
|
||||
|
||||
Elk specific option that allows edges to share path where it convenient. It can make for pretty diagrams but can also make it harder to read the diagram.
|
||||
|
||||
#### nodePlacementStrategy?
|
||||
|
||||
> `optional` **nodePlacementStrategy**: `"SIMPLE"` | `"NETWORK_SIMPLEX"` | `"LINEAR_SEGMENTS"` | `"BRANDES_KOEPF"`
|
||||
|
||||
Elk specific option affecting how nodes are placed.
|
||||
|
||||
---
|
||||
|
||||
### er?
|
||||
|
||||
> `optional` **er**: `ErDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:189](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L189)
|
||||
|
||||
---
|
||||
|
||||
### flowchart?
|
||||
|
||||
> `optional` **flowchart**: `FlowchartDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:182](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L182)
|
||||
|
||||
---
|
||||
|
||||
### fontFamily?
|
||||
|
||||
> `optional` **fontFamily**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:121](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L121)
|
||||
|
||||
Specifies the font to be used in the rendered diagrams.
|
||||
Can be any possible CSS `font-family`.
|
||||
See <https://developer.mozilla.org/en-US/docs/Web/CSS/font-family>
|
||||
|
||||
---
|
||||
|
||||
### fontSize?
|
||||
|
||||
> `optional` **fontSize**: `number`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:205](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L205)
|
||||
|
||||
---
|
||||
|
||||
### forceLegacyMathML?
|
||||
|
||||
> `optional` **forceLegacyMathML**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:163](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L163)
|
||||
|
||||
This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS
|
||||
fonts and browser's MathML implementation, this option is recommended if consistent rendering is important.
|
||||
If set to true, ignores legacyMathML.
|
||||
|
||||
---
|
||||
|
||||
### gantt?
|
||||
|
||||
> `optional` **gantt**: `GanttDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:184](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L184)
|
||||
|
||||
---
|
||||
|
||||
### gitGraph?
|
||||
|
||||
> `optional` **gitGraph**: `GitGraphDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:197](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L197)
|
||||
|
||||
---
|
||||
|
||||
### handDrawnSeed?
|
||||
|
||||
> `optional` **handDrawnSeed**: `number`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:76](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L76)
|
||||
|
||||
Defines the seed to be used when using handDrawn look. This is important for the automated tests as they will always find differences without the seed. The default value is 0 which gives a random seed.
|
||||
|
||||
---
|
||||
|
||||
### htmlLabels?
|
||||
|
||||
> `optional` **htmlLabels**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:114](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L114)
|
||||
|
||||
---
|
||||
|
||||
### journey?
|
||||
|
||||
> `optional` **journey**: `JourneyDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:185](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L185)
|
||||
|
||||
---
|
||||
|
||||
### kanban?
|
||||
|
||||
> `optional` **kanban**: `KanbanDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:196](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L196)
|
||||
|
||||
---
|
||||
|
||||
### layout?
|
||||
|
||||
> `optional` **layout**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L81)
|
||||
|
||||
Defines which layout algorithm to use for rendering the diagram.
|
||||
|
||||
---
|
||||
|
||||
### legacyMathML?
|
||||
|
||||
> `optional` **legacyMathML**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L156)
|
||||
|
||||
This option specifies if Mermaid can expect the dependent to include KaTeX stylesheets for browsers
|
||||
without their own MathML implementation. If this option is disabled and MathML is not supported, the math
|
||||
equations are replaced with a warning. If this option is enabled and MathML is not supported, Mermaid will
|
||||
fall back to legacy rendering for KaTeX.
|
||||
|
||||
---
|
||||
|
||||
### logLevel?
|
||||
|
||||
> `optional` **logLevel**: `0` | `2` | `1` | `"trace"` | `"debug"` | `"info"` | `"warn"` | `"error"` | `"fatal"` | `3` | `4` | `5`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:127](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L127)
|
||||
|
||||
This option decides the amount of logging to be used by mermaid.
|
||||
|
||||
---
|
||||
|
||||
### look?
|
||||
|
||||
> `optional` **look**: `"classic"` | `"handDrawn"`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L71)
|
||||
|
||||
Defines which main look to use for the diagram.
|
||||
|
||||
---
|
||||
|
||||
### markdownAutoWrap?
|
||||
|
||||
> `optional` **markdownAutoWrap**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:206](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L206)
|
||||
|
||||
---
|
||||
|
||||
### maxEdges?
|
||||
|
||||
> `optional` **maxEdges**: `number`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L90)
|
||||
|
||||
Defines the maximum number of edges that can be drawn in a graph.
|
||||
|
||||
---
|
||||
|
||||
### maxTextSize?
|
||||
|
||||
> `optional` **maxTextSize**: `number`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L85)
|
||||
|
||||
The maximum allowed size of the users text diagram
|
||||
|
||||
---
|
||||
|
||||
### mindmap?
|
||||
|
||||
> `optional` **mindmap**: `MindmapDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:195](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L195)
|
||||
|
||||
---
|
||||
|
||||
### packet?
|
||||
|
||||
> `optional` **packet**: `PacketDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L200)
|
||||
|
||||
---
|
||||
|
||||
### pie?
|
||||
|
||||
> `optional` **pie**: `PieDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:190](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L190)
|
||||
|
||||
---
|
||||
|
||||
### quadrantChart?
|
||||
|
||||
> `optional` **quadrantChart**: `QuadrantChartConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:191](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L191)
|
||||
|
||||
---
|
||||
|
||||
### radar?
|
||||
|
||||
> `optional` **radar**: `RadarDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:202](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L202)
|
||||
|
||||
---
|
||||
|
||||
### requirement?
|
||||
|
||||
> `optional` **requirement**: `RequirementDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:193](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L193)
|
||||
|
||||
---
|
||||
|
||||
### sankey?
|
||||
|
||||
> `optional` **sankey**: `SankeyDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:199](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L199)
|
||||
|
||||
---
|
||||
|
||||
### secure?
|
||||
|
||||
> `optional` **secure**: `string`\[]
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L148)
|
||||
|
||||
This option controls which `currentConfig` keys are considered secure and
|
||||
can only be changed via call to `mermaid.initialize`.
|
||||
This prevents malicious graph directives from overriding a site's default security.
|
||||
|
||||
---
|
||||
|
||||
### securityLevel?
|
||||
|
||||
> `optional` **securityLevel**: `"strict"` | `"loose"` | `"antiscript"` | `"sandbox"`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L131)
|
||||
|
||||
Level of trust for parsed diagram
|
||||
|
||||
---
|
||||
|
||||
### sequence?
|
||||
|
||||
> `optional` **sequence**: `SequenceDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:183](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L183)
|
||||
|
||||
---
|
||||
|
||||
### startOnLoad?
|
||||
|
||||
> `optional` **startOnLoad**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:135](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L135)
|
||||
|
||||
Dictates whether mermaid starts on Page load
|
||||
|
||||
---
|
||||
|
||||
### state?
|
||||
|
||||
> `optional` **state**: `StateDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L188)
|
||||
|
||||
---
|
||||
|
||||
### suppressErrorRendering?
|
||||
|
||||
> `optional` **suppressErrorRendering**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:212](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L212)
|
||||
|
||||
Suppresses inserting 'Syntax error' diagram in the DOM.
|
||||
This is useful when you want to control how to handle syntax errors in your application.
|
||||
|
||||
---
|
||||
|
||||
### theme?
|
||||
|
||||
> `optional` **theme**: `"default"` | `"base"` | `"dark"` | `"forest"` | `"neutral"` | `"null"`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L64)
|
||||
|
||||
Theme, the CSS style sheet.
|
||||
You may also use `themeCSS` to override this value.
|
||||
|
||||
---
|
||||
|
||||
### themeCSS?
|
||||
|
||||
> `optional` **themeCSS**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:66](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L66)
|
||||
|
||||
---
|
||||
|
||||
### themeVariables?
|
||||
|
||||
> `optional` **themeVariables**: `any`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L65)
|
||||
|
||||
---
|
||||
|
||||
### timeline?
|
||||
|
||||
> `optional` **timeline**: `TimelineDiagramConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:186](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L186)
|
||||
|
||||
---
|
||||
|
||||
### wrap?
|
||||
|
||||
> `optional` **wrap**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:204](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L204)
|
||||
|
||||
---
|
||||
|
||||
### xyChart?
|
||||
|
||||
> `optional` **xyChart**: `XYChartConfig`
|
||||
|
||||
Defined in: [packages/mermaid/src/config.type.ts:192](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L192)
|
24
docs/config/setup/mermaid/interfaces/ParseOptions.md
Normal file
24
docs/config/setup/mermaid/interfaces/ParseOptions.md
Normal file
@@ -0,0 +1,24 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseOptions.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: ParseOptions
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:59](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L59)
|
||||
|
||||
## Properties
|
||||
|
||||
### suppressErrors?
|
||||
|
||||
> `optional` **suppressErrors**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L64)
|
||||
|
||||
If `true`, parse will return `false` instead of throwing error when the diagram is invalid.
|
||||
The `parseError` function will not be called.
|
33
docs/config/setup/mermaid/interfaces/ParseResult.md
Normal file
33
docs/config/setup/mermaid/interfaces/ParseResult.md
Normal file
@@ -0,0 +1,33 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseResult.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/ParseResult.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: ParseResult
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:67](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L67)
|
||||
|
||||
## Properties
|
||||
|
||||
### config
|
||||
|
||||
> **config**: [`MermaidConfig`](MermaidConfig.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L75)
|
||||
|
||||
The config passed as YAML frontmatter or directives
|
||||
|
||||
---
|
||||
|
||||
### diagramType
|
||||
|
||||
> **diagramType**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:71](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L71)
|
||||
|
||||
The diagram type, e.g. 'flowchart', 'sequence', etc.
|
21
docs/config/setup/mermaid/interfaces/RenderOptions.md
Normal file
21
docs/config/setup/mermaid/interfaces/RenderOptions.md
Normal file
@@ -0,0 +1,21 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderOptions.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: RenderOptions
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:7](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L7)
|
||||
|
||||
## Properties
|
||||
|
||||
### algorithm?
|
||||
|
||||
> `optional` **algorithm**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/rendering-util/render.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/rendering-util/render.ts#L8)
|
60
docs/config/setup/mermaid/interfaces/RenderResult.md
Normal file
60
docs/config/setup/mermaid/interfaces/RenderResult.md
Normal file
@@ -0,0 +1,60 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderResult.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RenderResult.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: RenderResult
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L85)
|
||||
|
||||
## Properties
|
||||
|
||||
### bindFunctions()?
|
||||
|
||||
> `optional` **bindFunctions**: (`element`) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:103](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L103)
|
||||
|
||||
Bind function to be called after the svg has been inserted into the DOM.
|
||||
This is necessary for adding event listeners to the elements in the svg.
|
||||
|
||||
```js
|
||||
const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B');
|
||||
div.innerHTML = svg;
|
||||
bindFunctions?.(div); // To call bindFunctions only if it's present.
|
||||
```
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### element
|
||||
|
||||
`Element`
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
---
|
||||
|
||||
### diagramType
|
||||
|
||||
> **diagramType**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:93](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L93)
|
||||
|
||||
The diagram type, e.g. 'flowchart', 'sequence', etc.
|
||||
|
||||
---
|
||||
|
||||
### svg
|
||||
|
||||
> **svg**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/types.ts:89](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L89)
|
||||
|
||||
The svg code for the rendered graph.
|
63
docs/config/setup/mermaid/interfaces/RunOptions.md
Normal file
63
docs/config/setup/mermaid/interfaces/RunOptions.md
Normal file
@@ -0,0 +1,63 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/interfaces/RunOptions.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/interfaces/RunOptions.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Interface: RunOptions
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:41](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L41)
|
||||
|
||||
## Properties
|
||||
|
||||
### nodes?
|
||||
|
||||
> `optional` **nodes**: `ArrayLike`<`HTMLElement`>
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:49](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L49)
|
||||
|
||||
The nodes to render. If this is set, `querySelector` will be ignored.
|
||||
|
||||
---
|
||||
|
||||
### postRenderCallback()?
|
||||
|
||||
> `optional` **postRenderCallback**: (`id`) => `unknown`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:53](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L53)
|
||||
|
||||
A callback to call after each diagram is rendered.
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### id
|
||||
|
||||
`string`
|
||||
|
||||
#### Returns
|
||||
|
||||
`unknown`
|
||||
|
||||
---
|
||||
|
||||
### querySelector?
|
||||
|
||||
> `optional` **querySelector**: `string`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:45](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L45)
|
||||
|
||||
The query selector to use when finding elements to render. Default: `".mermaid"`.
|
||||
|
||||
---
|
||||
|
||||
### suppressErrors?
|
||||
|
||||
> `optional` **suppressErrors**: `boolean`
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:57](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L57)
|
||||
|
||||
If `true`, errors will be logged to the console, but not thrown. Default: `false`
|
15
docs/config/setup/mermaid/type-aliases/InternalHelpers.md
Normal file
15
docs/config/setup/mermaid/type-aliases/InternalHelpers.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/InternalHelpers.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/InternalHelpers.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Type Alias: InternalHelpers
|
||||
|
||||
> **InternalHelpers**: _typeof_ `internalHelpers`
|
||||
|
||||
Defined in: [packages/mermaid/src/internals.ts:33](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/internals.ts#L33)
|
29
docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md
Normal file
29
docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md
Normal file
@@ -0,0 +1,29 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/ParseErrorFunction.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Type Alias: ParseErrorFunction()
|
||||
|
||||
> **ParseErrorFunction**: (`err`, `hash`?) => `void`
|
||||
|
||||
Defined in: [packages/mermaid/src/Diagram.ts:10](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/Diagram.ts#L10)
|
||||
|
||||
## Parameters
|
||||
|
||||
### err
|
||||
|
||||
`string` | [`DetailedError`](../interfaces/DetailedError.md) | `unknown`
|
||||
|
||||
### hash?
|
||||
|
||||
`any`
|
||||
|
||||
## Returns
|
||||
|
||||
`void`
|
15
docs/config/setup/mermaid/type-aliases/SVG.md
Normal file
15
docs/config/setup/mermaid/type-aliases/SVG.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVG.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVG.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Type Alias: SVG
|
||||
|
||||
> **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:130](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L130)
|
15
docs/config/setup/mermaid/type-aliases/SVGGroup.md
Normal file
15
docs/config/setup/mermaid/type-aliases/SVGGroup.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVGGroup.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/type-aliases/SVGGroup.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Type Alias: SVGGroup
|
||||
|
||||
> **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`>
|
||||
|
||||
Defined in: [packages/mermaid/src/diagram-api/types.ts:132](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L132)
|
15
docs/config/setup/mermaid/variables/default.md
Normal file
15
docs/config/setup/mermaid/variables/default.md
Normal file
@@ -0,0 +1,15 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/mermaid/variables/default.md](../../../../../packages/mermaid/src/docs/config/setup/mermaid/variables/default.md).
|
||||
|
||||
[**mermaid**](../../README.md)
|
||||
|
||||
---
|
||||
|
||||
# Variable: default
|
||||
|
||||
> `const` **default**: [`Mermaid`](../interfaces/Mermaid.md)
|
||||
|
||||
Defined in: [packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
|
@@ -1,295 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/config.md](../../../../packages/mermaid/src/docs/config/setup/modules/config.md).
|
||||
|
||||
# Module: config
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Variables
|
||||
|
||||
- [defaultConfig](config.md#defaultconfig)
|
||||
|
||||
### Functions
|
||||
|
||||
- [addDirective](config.md#adddirective)
|
||||
- [getConfig](config.md#getconfig)
|
||||
- [getSiteConfig](config.md#getsiteconfig)
|
||||
- [reset](config.md#reset)
|
||||
- [sanitize](config.md#sanitize)
|
||||
- [saveConfigFromInitialize](config.md#saveconfigfrominitialize)
|
||||
- [setConfig](config.md#setconfig)
|
||||
- [setSiteConfig](config.md#setsiteconfig)
|
||||
- [updateCurrentConfig](config.md#updatecurrentconfig)
|
||||
- [updateSiteConfig](config.md#updatesiteconfig)
|
||||
|
||||
## Variables
|
||||
|
||||
### defaultConfig
|
||||
|
||||
• `Const` **defaultConfig**: [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8)
|
||||
|
||||
## Functions
|
||||
|
||||
### addDirective
|
||||
|
||||
▸ **addDirective**(`directive`): `void`
|
||||
|
||||
Pushes in a directive to the configuration
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :---------- | :-------------------------------------------------------- | :----------------------- |
|
||||
| `directive` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The directive to push in |
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188)
|
||||
|
||||
---
|
||||
|
||||
### getConfig
|
||||
|
||||
▸ **getConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
## getConfig
|
||||
|
||||
| Function | Description | Type | Return Values |
|
||||
| --------- | ------------------------- | ----------- | ------------------------------ |
|
||||
| getConfig | Obtains the currentConfig | Get Request | Any Values from current Config |
|
||||
|
||||
**Notes**: Avoid calling this function repeatedly. Instead, store the result in a variable and use it, and pass it down to function calls.
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
The currentConfig
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131)
|
||||
|
||||
---
|
||||
|
||||
### getSiteConfig
|
||||
|
||||
▸ **getSiteConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
## getSiteConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------------------- | ----------- | -------------------------------- |
|
||||
| setSiteConfig | Returns the current siteConfig base configuration | Get Request | Returns Any Values in siteConfig |
|
||||
|
||||
**Notes**: Returns **any** values in siteConfig.
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
The siteConfig
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96)
|
||||
|
||||
---
|
||||
|
||||
### reset
|
||||
|
||||
▸ **reset**(`config?`): `void`
|
||||
|
||||
## reset
|
||||
|
||||
| Function | Description | Type | Required | Values |
|
||||
| -------- | ---------------------------- | ----------- | -------- | ------ |
|
||||
| reset | Resets currentConfig to conf | Put Request | Required | None |
|
||||
|
||||
## conf
|
||||
|
||||
| Parameter | Description | Type | Required | Values |
|
||||
| --------- | -------------------------------------------------------------- | ---------- | -------- | -------------------------------------------- |
|
||||
| conf | base set of values, which currentConfig could be **reset** to. | Dictionary | Required | Any Values, with respect to the secure Array |
|
||||
|
||||
**Notes**: (default: current siteConfig ) (optional, default `getSiteConfig()`)
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Default value | Description |
|
||||
| :------- | :-------------------------------------------------------- | :------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| `config` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | `siteConfig` | base set of values, which currentConfig could be **reset** to. Defaults to the current siteConfig (e.g returned by [getSiteConfig](config.md#getsiteconfig)). |
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:221](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L221)
|
||||
|
||||
---
|
||||
|
||||
### sanitize
|
||||
|
||||
▸ **sanitize**(`options`): `void`
|
||||
|
||||
## sanitize
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| -------- | -------------------------------------- | ----------- | ------ |
|
||||
| sanitize | Sets the siteConfig to desired values. | Put Request | None |
|
||||
|
||||
Ensures options parameter does not attempt to override siteConfig secure keys **Notes**: modifies
|
||||
options in-place
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :-------- | :---- | :-------------------------------- |
|
||||
| `options` | `any` | The potential setConfig parameter |
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146)
|
||||
|
||||
---
|
||||
|
||||
### saveConfigFromInitialize
|
||||
|
||||
▸ **saveConfigFromInitialize**(`conf`): `void`
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :----- | :-------------------------------------------------------- |
|
||||
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
|
||||
|
||||
#### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75)
|
||||
|
||||
---
|
||||
|
||||
### setConfig
|
||||
|
||||
▸ **setConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
## setConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
|
||||
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
|
||||
|
||||
**Notes**: Sets the currentConfig. The parameter conf is sanitized based on the siteConfig.secure
|
||||
keys. Any values found in conf with key found in siteConfig.secure will be replaced with the
|
||||
corresponding siteConfig value.
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :----- | :-------------------------------------------------------- | :-------------------------- |
|
||||
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The potential currentConfig |
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
The currentConfig merged with the sanitized conf
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113)
|
||||
|
||||
---
|
||||
|
||||
### setSiteConfig
|
||||
|
||||
▸ **setSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
## setSiteConfig
|
||||
|
||||
| Function | Description | Type | Values |
|
||||
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
|
||||
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
|
||||
|
||||
**Notes:** Sets the siteConfig. The siteConfig is a protected configuration for repeat use. Calls
|
||||
to reset() will reset the currentConfig to siteConfig. Calls to reset(configApi.defaultConfig)
|
||||
will reset siteConfig and currentConfig to the defaultConfig Note: currentConfig is set in this
|
||||
function _Default value: At default, will mirror Global Config_
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type | Description |
|
||||
| :----- | :-------------------------------------------------------- | :------------------------------------------ |
|
||||
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The base currentConfig to use as siteConfig |
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
The new siteConfig
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61)
|
||||
|
||||
---
|
||||
|
||||
### updateCurrentConfig
|
||||
|
||||
▸ **updateCurrentConfig**(`siteCfg`, `_directives`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :------------ | :----------------------------------------------------------- |
|
||||
| `siteCfg` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
|
||||
| `_directives` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)\[] |
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15)
|
||||
|
||||
---
|
||||
|
||||
### updateSiteConfig
|
||||
|
||||
▸ **updateSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
#### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :----- | :-------------------------------------------------------- |
|
||||
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
|
||||
|
||||
#### Returns
|
||||
|
||||
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79)
|
@@ -1,40 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/defaultConfig.md](../../../../packages/mermaid/src/docs/config/setup/modules/defaultConfig.md).
|
||||
|
||||
# Module: defaultConfig
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Variables
|
||||
|
||||
- [configKeys](defaultConfig.md#configkeys)
|
||||
- [default](defaultConfig.md#default)
|
||||
|
||||
## Variables
|
||||
|
||||
### configKeys
|
||||
|
||||
• `Const` **configKeys**: `Set`<`string`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/defaultConfig.ts:270](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L270)
|
||||
|
||||
---
|
||||
|
||||
### default
|
||||
|
||||
• `Const` **default**: `RequiredDeep`<[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)>
|
||||
|
||||
Default mermaid configuration options.
|
||||
|
||||
Please see the Mermaid config JSON Schema for the default JSON values.
|
||||
Non-JSON JS default values are listed in this file, e.g. functions, or
|
||||
`undefined` (explicitly set so that `configKeys` finds them).
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18)
|
@@ -1,103 +0,0 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/mermaid.md](../../../../packages/mermaid/src/docs/config/setup/modules/mermaid.md).
|
||||
|
||||
# Module: mermaid
|
||||
|
||||
## Table of contents
|
||||
|
||||
### Classes
|
||||
|
||||
- [UnknownDiagramError](../classes/mermaid.UnknownDiagramError.md)
|
||||
|
||||
### Interfaces
|
||||
|
||||
- [DetailedError](../interfaces/mermaid.DetailedError.md)
|
||||
- [ExternalDiagramDefinition](../interfaces/mermaid.ExternalDiagramDefinition.md)
|
||||
- [LayoutData](../interfaces/mermaid.LayoutData.md)
|
||||
- [LayoutLoaderDefinition](../interfaces/mermaid.LayoutLoaderDefinition.md)
|
||||
- [Mermaid](../interfaces/mermaid.Mermaid.md)
|
||||
- [MermaidConfig](../interfaces/mermaid.MermaidConfig.md)
|
||||
- [ParseOptions](../interfaces/mermaid.ParseOptions.md)
|
||||
- [ParseResult](../interfaces/mermaid.ParseResult.md)
|
||||
- [RenderOptions](../interfaces/mermaid.RenderOptions.md)
|
||||
- [RenderResult](../interfaces/mermaid.RenderResult.md)
|
||||
- [RunOptions](../interfaces/mermaid.RunOptions.md)
|
||||
|
||||
### Type Aliases
|
||||
|
||||
- [InternalHelpers](mermaid.md#internalhelpers)
|
||||
- [ParseErrorFunction](mermaid.md#parseerrorfunction)
|
||||
- [SVG](mermaid.md#svg)
|
||||
- [SVGGroup](mermaid.md#svggroup)
|
||||
|
||||
### Variables
|
||||
|
||||
- [default](mermaid.md#default)
|
||||
|
||||
## Type Aliases
|
||||
|
||||
### InternalHelpers
|
||||
|
||||
Ƭ **InternalHelpers**: typeof `internalHelpers`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/internals.ts:33](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/internals.ts#L33)
|
||||
|
||||
---
|
||||
|
||||
### ParseErrorFunction
|
||||
|
||||
Ƭ **ParseErrorFunction**: (`err`: `string` | [`DetailedError`](../interfaces/mermaid.DetailedError.md) | `unknown`, `hash?`: `any`) => `void`
|
||||
|
||||
#### Type declaration
|
||||
|
||||
▸ (`err`, `hash?`): `void`
|
||||
|
||||
##### Parameters
|
||||
|
||||
| Name | Type |
|
||||
| :------ | :--------------------------------------------------------------------------------- |
|
||||
| `err` | `string` \| [`DetailedError`](../interfaces/mermaid.DetailedError.md) \| `unknown` |
|
||||
| `hash?` | `any` |
|
||||
|
||||
##### Returns
|
||||
|
||||
`void`
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/Diagram.ts:10](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/Diagram.ts#L10)
|
||||
|
||||
---
|
||||
|
||||
### SVG
|
||||
|
||||
Ƭ **SVG**: `d3.Selection`<`SVGSVGElement`, `unknown`, `Element` | `null`, `unknown`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/diagram-api/types.ts:130](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L130)
|
||||
|
||||
---
|
||||
|
||||
### SVGGroup
|
||||
|
||||
Ƭ **SVGGroup**: `d3.Selection`<`SVGGElement`, `unknown`, `Element` | `null`, `unknown`>
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/diagram-api/types.ts:132](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L132)
|
||||
|
||||
## Variables
|
||||
|
||||
### default
|
||||
|
||||
• `Const` **default**: [`Mermaid`](../interfaces/mermaid.Mermaid.md)
|
||||
|
||||
#### Defined in
|
||||
|
||||
[packages/mermaid/src/mermaid.ts:442](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L442)
|
253
docs/syntax/radar.md
Normal file
253
docs/syntax/radar.md
Normal file
@@ -0,0 +1,253 @@
|
||||
> **Warning**
|
||||
>
|
||||
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
|
||||
>
|
||||
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/syntax/radar.md](../../packages/mermaid/src/docs/syntax/radar.md).
|
||||
|
||||
# Radar Diagram (v11.6.0+)
|
||||
|
||||
## Introduction
|
||||
|
||||
A radar diagram is a simple way to plot low-dimensional data in a circular format.
|
||||
|
||||
It is also known as a **radar chart**, **spider chart**, **star chart**, **cobweb chart**, **polar chart**, or **Kiviat diagram**.
|
||||
|
||||
## Usage
|
||||
|
||||
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.
|
||||
|
||||
It is commonly used to graphically summarize and compare the performance of multiple entities across multiple dimensions.
|
||||
|
||||
## Syntax
|
||||
|
||||
```md
|
||||
radar-beta
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
... More Fields ...
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
```mermaid-example
|
||||
---
|
||||
title: "Grades"
|
||||
---
|
||||
radar-beta
|
||||
axis m["Math"], s["Science"], e["English"]
|
||||
axis h["History"], g["Geography"], a["Art"]
|
||||
curve a["Alice"]{85, 90, 80, 70, 75, 90}
|
||||
curve b["Bob"]{70, 75, 85, 80, 90, 85}
|
||||
|
||||
max 100
|
||||
min 0
|
||||
```
|
||||
|
||||
```mermaid
|
||||
---
|
||||
title: "Grades"
|
||||
---
|
||||
radar-beta
|
||||
axis m["Math"], s["Science"], e["English"]
|
||||
axis h["History"], g["Geography"], a["Art"]
|
||||
curve a["Alice"]{85, 90, 80, 70, 75, 90}
|
||||
curve b["Bob"]{70, 75, 85, 80, 90, 85}
|
||||
|
||||
max 100
|
||||
min 0
|
||||
```
|
||||
|
||||
```mermaid-example
|
||||
radar-beta
|
||||
title Restaurant Comparison
|
||||
axis food["Food Quality"], service["Service"], price["Price"]
|
||||
axis ambiance["Ambiance"],
|
||||
|
||||
curve a["Restaurant A"]{4, 3, 2, 4}
|
||||
curve b["Restaurant B"]{3, 4, 3, 3}
|
||||
curve c["Restaurant C"]{2, 3, 4, 2}
|
||||
curve d["Restaurant D"]{2, 2, 4, 3}
|
||||
|
||||
graticule polygon
|
||||
max 5
|
||||
|
||||
```
|
||||
|
||||
```mermaid
|
||||
radar-beta
|
||||
title Restaurant Comparison
|
||||
axis food["Food Quality"], service["Service"], price["Price"]
|
||||
axis ambiance["Ambiance"],
|
||||
|
||||
curve a["Restaurant A"]{4, 3, 2, 4}
|
||||
curve b["Restaurant B"]{3, 4, 3, 3}
|
||||
curve c["Restaurant C"]{2, 3, 4, 2}
|
||||
curve d["Restaurant D"]{2, 2, 4, 3}
|
||||
|
||||
graticule polygon
|
||||
max 5
|
||||
|
||||
```
|
||||
|
||||
## Details of Syntax
|
||||
|
||||
### Title
|
||||
|
||||
`title`: The title is an optional field that allows to render a title at the top of the radar diagram.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
title Title of the Radar Diagram
|
||||
...
|
||||
```
|
||||
|
||||
### Axis
|
||||
|
||||
`axis`: The axis keyword is used to define the axes of the radar diagram.
|
||||
|
||||
Each axis is represented by an ID and an optional label.
|
||||
|
||||
Multiple axes can be defined in a single line.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
axis id1["Label1"]
|
||||
axis id2["Label2"], id3["Label3"]
|
||||
...
|
||||
```
|
||||
|
||||
### Curve
|
||||
|
||||
`curve`: The curve keyword is used to define the data points for a curve in the radar diagram.
|
||||
|
||||
Each curve is represented by an ID, an optional label, and a list of values.
|
||||
|
||||
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.
|
||||
|
||||
Multiple curves can be defined in a single line.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
axis axis1, axis2, axis3
|
||||
curve id1["Label1"]{1, 2, 3}
|
||||
curve id2["Label2"]{4, 5, 6}, id3{7, 8, 9}
|
||||
curve id4{ axis3: 30, axis1: 20, axis2: 10 }
|
||||
...
|
||||
```
|
||||
|
||||
### Options
|
||||
|
||||
- `showLegend`: The showLegend keyword is used to show or hide the legend in the radar diagram. The legend is shown by default.
|
||||
- `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.
|
||||
- `min`: The minimum value for the radar diagram. This is used to scale the radar diagram. If not provided, the minimum value is `0`.
|
||||
- `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`.
|
||||
- `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`.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
...
|
||||
showLegend true
|
||||
max 100
|
||||
min 0
|
||||
graticule circle
|
||||
ticks 5
|
||||
...
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
Please refer to the [configuration](/config/schema-docs/config-defs-radar-diagram-config.html) guide for details.
|
||||
|
||||
| Parameter | Description | Default Value |
|
||||
| --------------- | ---------------------------------------- | ------------- |
|
||||
| width | Width of the radar diagram | `600` |
|
||||
| height | Height of the radar diagram | `600` |
|
||||
| marginTop | Top margin of the radar diagram | `50` |
|
||||
| marginBottom | Bottom margin of the radar diagram | `50` |
|
||||
| marginLeft | Left margin of the radar diagram | `50` |
|
||||
| marginRight | Right margin of the radar diagram | `50` |
|
||||
| axisScaleFactor | Scale factor for the axis | `1` |
|
||||
| axisLabelFactor | Factor to adjust the axis label position | `1.05` |
|
||||
| curveTension | Tension for the rounded curves | `0.17` |
|
||||
|
||||
## Theme Variables
|
||||
|
||||
### Global Theme Variables
|
||||
|
||||
> **Note**
|
||||
> 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:
|
||||
> %%{init: {"themeVariables": {"cScale0": "#FF0000", "cScale1": "#00FF00"}} }%%
|
||||
|
||||
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`.
|
||||
|
||||
| Property | Description |
|
||||
| ---------- | ------------------------------ |
|
||||
| fontSize | Font size of the title |
|
||||
| titleColor | Color of the title |
|
||||
| cScale${i} | Color scale for the i-th curve |
|
||||
|
||||
### Radar Style Options
|
||||
|
||||
> **Note**
|
||||
> Specific variables for radar resides inside the `radar` key. To set the radar style options, use this syntax.
|
||||
> %%{init: {"themeVariables": {"radar": {"axisColor": "#FF0000"}} } }%%
|
||||
|
||||
| Property | Description | Default Value |
|
||||
| -------------------- | ---------------------------- | ------------- |
|
||||
| axisColor | Color of the axis lines | `black` |
|
||||
| axisStrokeWidth | Width of the axis lines | `1` |
|
||||
| axisLabelFontSize | Font size of the axis labels | `12px` |
|
||||
| curveOpacity | Opacity of the curves | `0.7` |
|
||||
| curveStrokeWidth | Width of the curves | `2` |
|
||||
| graticuleColor | Color of the graticule | `black` |
|
||||
| graticuleOpacity | Opacity of the graticule | `0.5` |
|
||||
| graticuleStrokeWidth | Width of the graticule | `1` |
|
||||
| legendBoxSize | Size of the legend box | `10` |
|
||||
| legendFontSize | Font size of the legend | `14px` |
|
||||
|
||||
## Example on config and theme
|
||||
|
||||
```mermaid-example
|
||||
---
|
||||
config:
|
||||
radar:
|
||||
axisScaleFactor: 0.25
|
||||
curveTension: 0.1
|
||||
theme: base
|
||||
themeVariables:
|
||||
cScale0: "#FF0000"
|
||||
cScale1: "#00FF00"
|
||||
cScale2: "#0000FF"
|
||||
radar:
|
||||
curveOpacity: 0
|
||||
---
|
||||
radar-beta
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
curve c3{3,3,3,3,3}
|
||||
```
|
||||
|
||||
```mermaid
|
||||
---
|
||||
config:
|
||||
radar:
|
||||
axisScaleFactor: 0.25
|
||||
curveTension: 0.1
|
||||
theme: base
|
||||
themeVariables:
|
||||
cScale0: "#FF0000"
|
||||
cScale1: "#00FF00"
|
||||
cScale2: "#0000FF"
|
||||
radar:
|
||||
curveOpacity: 0
|
||||
---
|
||||
radar-beta
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
curve c3{3,3,3,3,3}
|
||||
```
|
||||
|
||||
<!--- cspell:ignore Kiviat --->
|
@@ -1,5 +1,24 @@
|
||||
# mermaid
|
||||
|
||||
## 11.6.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- [#6408](https://github.com/mermaid-js/mermaid/pull/6408) [`ad65313`](https://github.com/mermaid-js/mermaid/commit/ad653138e16765d095613a6e5de86dc5e52ac8f0) Thanks [@ashishjain0512](https://github.com/ashishjain0512)! - fix: restore curve type configuration functionality for flowcharts. This fixes the issue where curve type settings were not being applied when configured through any of the following methods:
|
||||
|
||||
- Config
|
||||
- Init directive (%%{ init: { 'flowchart': { 'curve': '...' } } }%%)
|
||||
- LinkStyle command (linkStyle default interpolate ...)
|
||||
|
||||
- [#6381](https://github.com/mermaid-js/mermaid/pull/6381) [`95d73bc`](https://github.com/mermaid-js/mermaid/commit/95d73bc3f064dbf261a06483f94a7ef4d0bb52eb) Thanks [@thomascizeron](https://github.com/thomascizeron)! - Add Radar Chart
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- [#2](https://github.com/calvinvette/mermaid/pull/2) [`16d9b63`](https://github.com/mermaid-js/mermaid/commit/16d9b6345749ab5f24d5b8433efc3635d4913863) Thanks [@calvinvette](https://github.com/calvinvette)! - - [#6388](https://github.com/mermaid-js/mermaid/pull/6386)
|
||||
Thanks [@bollwyvl](https://github.com/bollwyvl) - Fix requirement diagram containment arrow
|
||||
- Updated dependencies [[`95d73bc`](https://github.com/mermaid-js/mermaid/commit/95d73bc3f064dbf261a06483f94a7ef4d0bb52eb)]:
|
||||
- @mermaid-js/parser@0.4.0
|
||||
|
||||
## 11.5.0
|
||||
|
||||
### Minor Changes
|
||||
|
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "mermaid",
|
||||
"version": "11.5.0",
|
||||
"version": "11.6.0",
|
||||
"description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.",
|
||||
"type": "module",
|
||||
"module": "./dist/mermaid.core.mjs",
|
||||
|
@@ -199,6 +199,7 @@ export interface MermaidConfig {
|
||||
sankey?: SankeyDiagramConfig;
|
||||
packet?: PacketDiagramConfig;
|
||||
block?: BlockDiagramConfig;
|
||||
radar?: RadarDiagramConfig;
|
||||
dompurifyConfig?: DOMPurifyConfiguration;
|
||||
wrap?: boolean;
|
||||
fontSize?: number;
|
||||
@@ -261,7 +262,19 @@ export interface FlowchartDiagramConfig extends BaseDiagramConfig {
|
||||
* Defines how mermaid renders curves for flowcharts.
|
||||
*
|
||||
*/
|
||||
curve?: 'basis' | 'linear' | 'cardinal';
|
||||
curve?:
|
||||
| 'basis'
|
||||
| 'bumpX'
|
||||
| 'bumpY'
|
||||
| 'cardinal'
|
||||
| 'catmullRom'
|
||||
| 'linear'
|
||||
| 'monotoneX'
|
||||
| 'monotoneY'
|
||||
| 'natural'
|
||||
| 'step'
|
||||
| 'stepAfter'
|
||||
| 'stepBefore';
|
||||
/**
|
||||
* Represents the padding between the labels and the shape
|
||||
*
|
||||
@@ -1526,6 +1539,50 @@ export interface PacketDiagramConfig extends BaseDiagramConfig {
|
||||
export interface BlockDiagramConfig extends BaseDiagramConfig {
|
||||
padding?: number;
|
||||
}
|
||||
/**
|
||||
* The object containing configurations specific for radar diagrams.
|
||||
*
|
||||
* This interface was referenced by `MermaidConfig`'s JSON-Schema
|
||||
* via the `definition` "RadarDiagramConfig".
|
||||
*/
|
||||
export interface RadarDiagramConfig extends BaseDiagramConfig {
|
||||
/**
|
||||
* The size of the radar diagram.
|
||||
*/
|
||||
width?: number;
|
||||
/**
|
||||
* The size of the radar diagram.
|
||||
*/
|
||||
height?: number;
|
||||
/**
|
||||
* The margin from the top of the radar diagram.
|
||||
*/
|
||||
marginTop?: number;
|
||||
/**
|
||||
* The margin from the right of the radar diagram.
|
||||
*/
|
||||
marginRight?: number;
|
||||
/**
|
||||
* The margin from the bottom of the radar diagram.
|
||||
*/
|
||||
marginBottom?: number;
|
||||
/**
|
||||
* The margin from the left of the radar diagram.
|
||||
*/
|
||||
marginLeft?: number;
|
||||
/**
|
||||
* The scale factor of the axis.
|
||||
*/
|
||||
axisScaleFactor?: number;
|
||||
/**
|
||||
* The scale factor of the axis label.
|
||||
*/
|
||||
axisLabelFactor?: number;
|
||||
/**
|
||||
* The tension factor for the Catmull-Rom spline conversion to cubic Bézier curves.
|
||||
*/
|
||||
curveTension?: number;
|
||||
}
|
||||
/**
|
||||
* This interface was referenced by `MermaidConfig`'s JSON-Schema
|
||||
* via the `definition` "FontConfig".
|
||||
|
@@ -255,8 +255,12 @@ const config: RequiredDeep<MermaidConfig> = {
|
||||
packet: {
|
||||
...defaultConfigJson.packet,
|
||||
},
|
||||
radar: {
|
||||
...defaultConfigJson.radar,
|
||||
},
|
||||
};
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
const keyify = (obj: any, prefix = ''): string[] =>
|
||||
Object.keys(obj).reduce((res: string[], el): string[] => {
|
||||
if (Array.isArray(obj[el])) {
|
||||
|
@@ -22,6 +22,7 @@ import mindmap from '../diagrams/mindmap/detector.js';
|
||||
import kanban from '../diagrams/kanban/detector.js';
|
||||
import sankey from '../diagrams/sankey/sankeyDetector.js';
|
||||
import { packet } from '../diagrams/packet/detector.js';
|
||||
import { radar } from '../diagrams/radar/detector.js';
|
||||
import block from '../diagrams/block/blockDetector.js';
|
||||
import architecture from '../diagrams/architecture/architectureDetector.js';
|
||||
import { registerLazyLoadedDiagrams } from './detectType.js';
|
||||
@@ -94,6 +95,7 @@ export const addDiagrams = () => {
|
||||
packet,
|
||||
xychart,
|
||||
block,
|
||||
architecture
|
||||
architecture,
|
||||
radar
|
||||
);
|
||||
};
|
||||
|
@@ -98,3 +98,31 @@ describe('flow db class', () => {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
describe('flow db getData', () => {
|
||||
let flowDb: FlowDB;
|
||||
beforeEach(() => {
|
||||
flowDb = new FlowDB();
|
||||
});
|
||||
|
||||
it('should use defaultInterpolate for edges without specific interpolate', () => {
|
||||
flowDb.addVertex('A', { text: 'A', type: 'text' }, undefined, [], [], '', {}, undefined);
|
||||
flowDb.addVertex('B', { text: 'B', type: 'text' }, undefined, [], [], '', {}, undefined);
|
||||
flowDb.addLink(['A'], ['B'], {});
|
||||
flowDb.updateLinkInterpolate(['default'], 'stepBefore');
|
||||
|
||||
const { edges } = flowDb.getData();
|
||||
expect(edges[0].curve).toBe('stepBefore');
|
||||
});
|
||||
|
||||
it('should prioritize edge-specific interpolate over defaultInterpolate', () => {
|
||||
flowDb.addVertex('A', { text: 'A', type: 'text' }, undefined, [], [], '', {}, undefined);
|
||||
flowDb.addVertex('B', { text: 'B', type: 'text' }, undefined, [], [], '', {}, undefined);
|
||||
flowDb.addLink(['A'], ['B'], {});
|
||||
flowDb.updateLinkInterpolate(['default'], 'stepBefore');
|
||||
flowDb.updateLinkInterpolate([0], 'basis');
|
||||
|
||||
const { edges } = flowDb.getData();
|
||||
expect(edges[0].curve).toBe('basis');
|
||||
});
|
||||
});
|
||||
|
@@ -252,6 +252,7 @@ export class FlowDB implements DiagramDB {
|
||||
labelType: 'text',
|
||||
classes: [],
|
||||
isUserDefinedId: false,
|
||||
interpolate: this.edges.defaultInterpolate,
|
||||
};
|
||||
log.info('abc78 Got edge...', edge);
|
||||
const linkTextObj = type.text;
|
||||
@@ -1124,6 +1125,7 @@ You have to call mermaid.initialize.`
|
||||
look: config.look,
|
||||
animate: rawEdge.animate,
|
||||
animation: rawEdge.animation,
|
||||
curve: rawEdge.interpolate || this.edges.defaultInterpolate || config.flowchart?.curve,
|
||||
};
|
||||
|
||||
edges.push(edge);
|
||||
|
128
packages/mermaid/src/diagrams/radar/db.ts
Normal file
128
packages/mermaid/src/diagrams/radar/db.ts
Normal file
@@ -0,0 +1,128 @@
|
||||
import { getConfig as commonGetConfig } from '../../config.js';
|
||||
import type { RadarDiagramConfig } from '../../config.type.js';
|
||||
import DEFAULT_CONFIG from '../../defaultConfig.js';
|
||||
import { cleanAndMerge } from '../../utils.js';
|
||||
import {
|
||||
clear as commonClear,
|
||||
getAccDescription,
|
||||
getAccTitle,
|
||||
getDiagramTitle,
|
||||
setAccDescription,
|
||||
setAccTitle,
|
||||
setDiagramTitle,
|
||||
} from '../common/commonDb.js';
|
||||
import type {
|
||||
Axis,
|
||||
Curve,
|
||||
Option,
|
||||
Entry,
|
||||
} from '../../../../parser/dist/src/language/generated/ast.js';
|
||||
import type { RadarAxis, RadarCurve, RadarOptions, RadarDB, RadarData } from './types.js';
|
||||
|
||||
const defaultOptions: RadarOptions = {
|
||||
showLegend: true,
|
||||
ticks: 5,
|
||||
max: null,
|
||||
min: 0,
|
||||
graticule: 'circle',
|
||||
};
|
||||
|
||||
const defaultRadarData: RadarData = {
|
||||
axes: [],
|
||||
curves: [],
|
||||
options: defaultOptions,
|
||||
};
|
||||
|
||||
let data: RadarData = structuredClone(defaultRadarData);
|
||||
|
||||
const DEFAULT_RADAR_CONFIG: Required<RadarDiagramConfig> = DEFAULT_CONFIG.radar;
|
||||
|
||||
const getConfig = (): Required<RadarDiagramConfig> => {
|
||||
const config = cleanAndMerge({
|
||||
...DEFAULT_RADAR_CONFIG,
|
||||
...commonGetConfig().radar,
|
||||
});
|
||||
return config;
|
||||
};
|
||||
|
||||
const getAxes = (): RadarAxis[] => data.axes;
|
||||
const getCurves = (): RadarCurve[] => data.curves;
|
||||
const getOptions = (): RadarOptions => data.options;
|
||||
|
||||
const setAxes = (axes: Axis[]) => {
|
||||
data.axes = axes.map((axis) => {
|
||||
return {
|
||||
name: axis.name,
|
||||
label: axis.label ?? axis.name,
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
const setCurves = (curves: Curve[]) => {
|
||||
data.curves = curves.map((curve) => {
|
||||
return {
|
||||
name: curve.name,
|
||||
label: curve.label ?? curve.name,
|
||||
entries: computeCurveEntries(curve.entries),
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
const computeCurveEntries = (entries: Entry[]): number[] => {
|
||||
// If entries have axis reference, we must order them according to the axes
|
||||
if (entries[0].axis == undefined) {
|
||||
return entries.map((entry) => entry.value);
|
||||
}
|
||||
const axes = getAxes();
|
||||
if (axes.length === 0) {
|
||||
throw new Error('Axes must be populated before curves for reference entries');
|
||||
}
|
||||
return axes.map((axis) => {
|
||||
const entry = entries.find((entry) => entry.axis?.$refText === axis.name);
|
||||
if (entry === undefined) {
|
||||
throw new Error('Missing entry for axis ' + axis.label);
|
||||
}
|
||||
return entry.value;
|
||||
});
|
||||
};
|
||||
|
||||
const setOptions = (options: Option[]) => {
|
||||
// Create a map from option names to option objects for quick lookup
|
||||
const optionMap = options.reduce(
|
||||
(acc, option) => {
|
||||
acc[option.name] = option;
|
||||
return acc;
|
||||
},
|
||||
{} as Record<string, Option>
|
||||
);
|
||||
|
||||
data.options = {
|
||||
showLegend: (optionMap.showLegend?.value as boolean) ?? defaultOptions.showLegend,
|
||||
ticks: (optionMap.ticks?.value as number) ?? defaultOptions.ticks,
|
||||
max: (optionMap.max?.value as number) ?? defaultOptions.max,
|
||||
min: (optionMap.min?.value as number) ?? defaultOptions.min,
|
||||
graticule: (optionMap.graticule?.value as 'circle' | 'polygon') ?? defaultOptions.graticule,
|
||||
};
|
||||
};
|
||||
|
||||
const clear = () => {
|
||||
commonClear();
|
||||
data = structuredClone(defaultRadarData);
|
||||
};
|
||||
|
||||
export const db: RadarDB = {
|
||||
getAxes,
|
||||
getCurves,
|
||||
getOptions,
|
||||
setAxes,
|
||||
setCurves,
|
||||
setOptions,
|
||||
getConfig,
|
||||
clear,
|
||||
setAccTitle,
|
||||
getAccTitle,
|
||||
setDiagramTitle,
|
||||
getDiagramTitle,
|
||||
getAccDescription,
|
||||
setAccDescription,
|
||||
};
|
22
packages/mermaid/src/diagrams/radar/detector.ts
Normal file
22
packages/mermaid/src/diagrams/radar/detector.ts
Normal file
@@ -0,0 +1,22 @@
|
||||
import type {
|
||||
DiagramDetector,
|
||||
DiagramLoader,
|
||||
ExternalDiagramDefinition,
|
||||
} from '../../diagram-api/types.js';
|
||||
|
||||
const id = 'radar';
|
||||
|
||||
const detector: DiagramDetector = (txt) => {
|
||||
return /^\s*radar-beta/.test(txt);
|
||||
};
|
||||
|
||||
const loader: DiagramLoader = async () => {
|
||||
const { diagram } = await import('./diagram.js');
|
||||
return { id, diagram };
|
||||
};
|
||||
|
||||
export const radar: ExternalDiagramDefinition = {
|
||||
id,
|
||||
detector,
|
||||
loader,
|
||||
};
|
12
packages/mermaid/src/diagrams/radar/diagram.ts
Normal file
12
packages/mermaid/src/diagrams/radar/diagram.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
import type { DiagramDefinition } from '../../diagram-api/types.js';
|
||||
import { db } from './db.js';
|
||||
import { parser } from './parser.js';
|
||||
import { renderer } from './renderer.js';
|
||||
import { styles } from './styles.js';
|
||||
|
||||
export const diagram: DiagramDefinition = {
|
||||
parser,
|
||||
db,
|
||||
renderer,
|
||||
styles,
|
||||
};
|
23
packages/mermaid/src/diagrams/radar/parser.ts
Normal file
23
packages/mermaid/src/diagrams/radar/parser.ts
Normal file
@@ -0,0 +1,23 @@
|
||||
import type { Radar } from '@mermaid-js/parser';
|
||||
import { parse } from '@mermaid-js/parser';
|
||||
import type { ParserDefinition } from '../../diagram-api/types.js';
|
||||
import { log } from '../../logger.js';
|
||||
import { populateCommonDb } from '../common/populateCommonDb.js';
|
||||
import { db } from './db.js';
|
||||
|
||||
const populate = (ast: Radar) => {
|
||||
populateCommonDb(ast, db);
|
||||
const { axes, curves, options } = ast;
|
||||
// Here we can add specific logic between the AST and the DB
|
||||
db.setAxes(axes);
|
||||
db.setCurves(curves);
|
||||
db.setOptions(options);
|
||||
};
|
||||
|
||||
export const parser: ParserDefinition = {
|
||||
parse: async (input: string): Promise<void> => {
|
||||
const ast: Radar = await parse('radar', input);
|
||||
log.debug(ast);
|
||||
populate(ast);
|
||||
},
|
||||
};
|
258
packages/mermaid/src/diagrams/radar/radar.spec.ts
Normal file
258
packages/mermaid/src/diagrams/radar/radar.spec.ts
Normal file
@@ -0,0 +1,258 @@
|
||||
import { it, describe, expect } from 'vitest';
|
||||
import { db } from './db.js';
|
||||
import { parser } from './parser.js';
|
||||
import { renderer, relativeRadius, closedRoundCurve } from './renderer.js';
|
||||
import { Diagram } from '../../Diagram.js';
|
||||
import mermaidAPI from '../../mermaidAPI.js';
|
||||
import { a } from 'vitest/dist/chunks/suite.qtkXWc6R.js';
|
||||
import { buildRadarStyleOptions } from './styles.js';
|
||||
|
||||
const {
|
||||
clear,
|
||||
getDiagramTitle,
|
||||
getAccTitle,
|
||||
getAccDescription,
|
||||
getAxes,
|
||||
getCurves,
|
||||
getOptions,
|
||||
getConfig,
|
||||
} = db;
|
||||
|
||||
describe('radar diagrams', () => {
|
||||
beforeEach(() => {
|
||||
clear();
|
||||
});
|
||||
|
||||
it('should handle a simple radar definition', async () => {
|
||||
const str = `radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
});
|
||||
|
||||
it('should handle diagram with data and title', async () => {
|
||||
const str = `radar-beta
|
||||
title Radar diagram
|
||||
accTitle: Radar accTitle
|
||||
accDescr: Radar accDescription
|
||||
axis A["Axis A"], B["Axis B"] ,C["Axis C"]
|
||||
curve mycurve["My Curve"]{1,2,3}
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
expect(getDiagramTitle()).toMatchInlineSnapshot('"Radar diagram"');
|
||||
expect(getAccTitle()).toMatchInlineSnapshot('"Radar accTitle"');
|
||||
expect(getAccDescription()).toMatchInlineSnapshot('"Radar accDescription"');
|
||||
expect(getAxes()).toMatchInlineSnapshot(`
|
||||
[
|
||||
{
|
||||
"label": "Axis A",
|
||||
"name": "A",
|
||||
},
|
||||
{
|
||||
"label": "Axis B",
|
||||
"name": "B",
|
||||
},
|
||||
{
|
||||
"label": "Axis C",
|
||||
"name": "C",
|
||||
},
|
||||
]
|
||||
`);
|
||||
expect(getCurves()).toMatchInlineSnapshot(`
|
||||
[
|
||||
{
|
||||
"entries": [
|
||||
1,
|
||||
2,
|
||||
3,
|
||||
],
|
||||
"label": "My Curve",
|
||||
"name": "mycurve",
|
||||
},
|
||||
]
|
||||
`);
|
||||
expect(getOptions()).toMatchInlineSnapshot(`
|
||||
{
|
||||
"graticule": "circle",
|
||||
"max": null,
|
||||
"min": 0,
|
||||
"showLegend": true,
|
||||
"ticks": 5,
|
||||
}
|
||||
`);
|
||||
});
|
||||
|
||||
it('should handle a radar diagram with options', async () => {
|
||||
const str = `radar-beta
|
||||
ticks 10
|
||||
showLegend false
|
||||
graticule polygon
|
||||
min 1
|
||||
max 10
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
expect(getOptions()).toMatchInlineSnapshot(`
|
||||
{
|
||||
"graticule": "polygon",
|
||||
"max": 10,
|
||||
"min": 1,
|
||||
"showLegend": false,
|
||||
"ticks": 10,
|
||||
}
|
||||
`);
|
||||
});
|
||||
|
||||
it('should handle curve with detailed data in any order', async () => {
|
||||
const str = `radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{ C: 3, A: 1, B: 2 }`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
expect(getCurves()).toMatchInlineSnapshot(`
|
||||
[
|
||||
{
|
||||
"entries": [
|
||||
1,
|
||||
2,
|
||||
3,
|
||||
],
|
||||
"label": "mycurve",
|
||||
"name": "mycurve",
|
||||
},
|
||||
]
|
||||
`);
|
||||
});
|
||||
|
||||
it('should handle radar diagram with comments', async () => {
|
||||
const str = `radar-beta
|
||||
%% This is a comment
|
||||
axis A,B,C
|
||||
%% This is another comment
|
||||
curve mycurve{1,2,3}
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
});
|
||||
|
||||
it('should handle radar diagram with config override', async () => {
|
||||
const str = `
|
||||
%%{init: {'radar': {'marginTop': 80, 'axisLabelFactor': 1.25}}}%%
|
||||
radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
});
|
||||
|
||||
it('should parse radar diagram with theme override', async () => {
|
||||
const str = `
|
||||
%%{init: { "theme": "base", "themeVariables": {'fontSize': 80, 'cScale0': '#123456' }}}%%
|
||||
radar-beta:
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
});
|
||||
|
||||
it('should handle radar diagram with radar style override', async () => {
|
||||
const str = `
|
||||
%%{init: { "theme": "base", "themeVariables": {'fontSize': 10, 'radar': { 'axisColor': '#FF0000' }}}}%%
|
||||
radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}
|
||||
`;
|
||||
await expect(parser.parse(str)).resolves.not.toThrow();
|
||||
});
|
||||
|
||||
describe('renderer', () => {
|
||||
describe('relativeRadius', () => {
|
||||
it('should calculate relative radius', () => {
|
||||
expect(relativeRadius(5, 0, 10, 100)).toBe(50);
|
||||
});
|
||||
|
||||
it('should handle min value', () => {
|
||||
expect(relativeRadius(0, 0, 10, 100)).toBe(0);
|
||||
});
|
||||
|
||||
it('should handle max value', () => {
|
||||
expect(relativeRadius(10, 0, 10, 100)).toBe(100);
|
||||
});
|
||||
|
||||
it('should clip values below min', () => {
|
||||
expect(relativeRadius(-5, 0, 10, 100)).toBe(0);
|
||||
});
|
||||
|
||||
it('should clip values above max', () => {
|
||||
expect(relativeRadius(15, 0, 10, 100)).toBe(100);
|
||||
});
|
||||
|
||||
it('should handle negative min', () => {
|
||||
expect(relativeRadius(5, -10, 10, 100)).toBe(75);
|
||||
});
|
||||
});
|
||||
|
||||
describe('closedRoundCurve', () => {
|
||||
it('should construct a polygon if tension is 0', () => {
|
||||
const points = [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 100, y: 0 },
|
||||
{ x: 100, y: 100 },
|
||||
{ x: 0, y: 100 },
|
||||
];
|
||||
const tension = 0;
|
||||
const path = closedRoundCurve(points, tension);
|
||||
expect(path).toMatchInlineSnapshot(
|
||||
`"M0,0 C0,0 100,0 100,0 C100,0 100,100 100,100 C100,100 0,100 0,100 C0,100 0,0 0,0 Z"`
|
||||
);
|
||||
});
|
||||
|
||||
it('should construct a simple round curve', () => {
|
||||
const points = [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 100, y: 100 },
|
||||
];
|
||||
const tension = 0.5;
|
||||
const path = closedRoundCurve(points, tension);
|
||||
expect(path).toMatchInlineSnapshot(`"M0,0 C0,0 100,100 100,100 C100,100 0,0 0,0 Z"`);
|
||||
});
|
||||
|
||||
it('should construct a closed round curve', () => {
|
||||
const points = [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 100, y: 0 },
|
||||
{ x: 100, y: 100 },
|
||||
{ x: 0, y: 100 },
|
||||
];
|
||||
const tension = 0.5;
|
||||
const path = closedRoundCurve(points, tension);
|
||||
expect(path).toMatchInlineSnapshot(
|
||||
`"M0,0 C50,-50 50,-50 100,0 C150,50 150,50 100,100 C50,150 50,150 0,100 C-50,50 -50,50 0,0 Z"`
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe('draw', () => {
|
||||
it('should draw a simple radar diagram', async () => {
|
||||
const str = `radar-beta
|
||||
axis A,B,C
|
||||
curve mycurve{1,2,3}`;
|
||||
await mermaidAPI.parse(str);
|
||||
const diagram = await Diagram.fromText(str);
|
||||
await diagram.renderer.draw(str, 'tst', '1.2.3', diagram);
|
||||
});
|
||||
|
||||
it('should draw a complex radar diagram', async () => {
|
||||
const str = `radar-beta
|
||||
title Radar diagram
|
||||
accTitle: Radar accTitle
|
||||
accDescr: Radar accDescription
|
||||
axis A["Axis A"], B["Axis B"] ,C["Axis C"]
|
||||
curve mycurve["My Curve"]{1,2,3}
|
||||
curve mycurve2["My Curve 2"]{ C: 1, A: 2, B: 3 }
|
||||
graticule polygon
|
||||
`;
|
||||
await mermaidAPI.parse(str);
|
||||
const diagram = await Diagram.fromText(str);
|
||||
await diagram.renderer.draw(str, 'tst', '1.2.3', diagram);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
232
packages/mermaid/src/diagrams/radar/renderer.ts
Normal file
232
packages/mermaid/src/diagrams/radar/renderer.ts
Normal file
@@ -0,0 +1,232 @@
|
||||
import type { Diagram } from '../../Diagram.js';
|
||||
import type { RadarDiagramConfig } from '../../config.type.js';
|
||||
import type { DiagramRenderer, DrawDefinition, SVG, SVGGroup } from '../../diagram-api/types.js';
|
||||
import { selectSvgElement } from '../../rendering-util/selectSvgElement.js';
|
||||
import type { RadarDB, RadarAxis, RadarCurve } from './types.js';
|
||||
|
||||
const draw: DrawDefinition = (_text, id, _version, diagram: Diagram) => {
|
||||
const db = diagram.db as RadarDB;
|
||||
const axes = db.getAxes();
|
||||
const curves = db.getCurves();
|
||||
const options = db.getOptions();
|
||||
const config = db.getConfig();
|
||||
const title = db.getDiagramTitle();
|
||||
|
||||
const svg: SVG = selectSvgElement(id);
|
||||
|
||||
// 🖼️ Draw the main frame
|
||||
const g = drawFrame(svg, config);
|
||||
|
||||
// The maximum value for the radar chart is the 'max' option if it exists,
|
||||
// otherwise it is the maximum value of the curves
|
||||
const maxValue: number =
|
||||
options.max ?? Math.max(...curves.map((curve) => Math.max(...curve.entries)));
|
||||
const minValue: number = options.min;
|
||||
const radius = Math.min(config.width, config.height) / 2;
|
||||
|
||||
// 🕸️ Draw graticule
|
||||
drawGraticule(g, axes, radius, options.ticks, options.graticule);
|
||||
|
||||
// 🪓 Draw the axes
|
||||
drawAxes(g, axes, radius, config);
|
||||
|
||||
// 📊 Draw the curves
|
||||
drawCurves(g, axes, curves, minValue, maxValue, options.graticule, config);
|
||||
|
||||
// 🏷 Draw Legend
|
||||
drawLegend(g, curves, options.showLegend, config);
|
||||
|
||||
// 🏷 Draw Title
|
||||
g.append('text')
|
||||
.attr('class', 'radarTitle')
|
||||
.text(title)
|
||||
.attr('x', 0)
|
||||
.attr('y', -config.height / 2 - config.marginTop);
|
||||
};
|
||||
|
||||
// Returns a g element to center the radar chart
|
||||
// it is of type SVGElement
|
||||
const drawFrame = (svg: SVG, config: Required<RadarDiagramConfig>): SVGGroup => {
|
||||
const totalWidth = config.width + config.marginLeft + config.marginRight;
|
||||
const totalHeight = config.height + config.marginTop + config.marginBottom;
|
||||
const center = {
|
||||
x: config.marginLeft + config.width / 2,
|
||||
y: config.marginTop + config.height / 2,
|
||||
};
|
||||
// Initialize the SVG
|
||||
svg
|
||||
.attr('viewbox', `0 0 ${totalWidth} ${totalHeight}`)
|
||||
.attr('width', totalWidth)
|
||||
.attr('height', totalHeight);
|
||||
// g element to center the radar chart
|
||||
return svg.append('g').attr('transform', `translate(${center.x}, ${center.y})`);
|
||||
};
|
||||
|
||||
const drawGraticule = (
|
||||
g: SVGGroup,
|
||||
axes: RadarAxis[],
|
||||
radius: number,
|
||||
ticks: number,
|
||||
graticule: string
|
||||
) => {
|
||||
if (graticule === 'circle') {
|
||||
// Draw a circle for each tick
|
||||
for (let i = 0; i < ticks; i++) {
|
||||
const r = (radius * (i + 1)) / ticks;
|
||||
g.append('circle').attr('r', r).attr('class', 'radarGraticule');
|
||||
}
|
||||
} else if (graticule === 'polygon') {
|
||||
// Draw a polygon
|
||||
const numAxes = axes.length;
|
||||
for (let i = 0; i < ticks; i++) {
|
||||
const r = (radius * (i + 1)) / ticks;
|
||||
const points = axes
|
||||
.map((_, j) => {
|
||||
const angle = (2 * j * Math.PI) / numAxes - Math.PI / 2;
|
||||
const x = r * Math.cos(angle);
|
||||
const y = r * Math.sin(angle);
|
||||
return `${x},${y}`;
|
||||
})
|
||||
.join(' ');
|
||||
g.append('polygon').attr('points', points).attr('class', 'radarGraticule');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const drawAxes = (
|
||||
g: SVGGroup,
|
||||
axes: RadarAxis[],
|
||||
radius: number,
|
||||
config: Required<RadarDiagramConfig>
|
||||
) => {
|
||||
const numAxes = axes.length;
|
||||
|
||||
for (let i = 0; i < numAxes; i++) {
|
||||
const label = axes[i].label;
|
||||
const angle = (2 * i * Math.PI) / numAxes - Math.PI / 2;
|
||||
g.append('line')
|
||||
.attr('x1', 0)
|
||||
.attr('y1', 0)
|
||||
.attr('x2', radius * config.axisScaleFactor * Math.cos(angle))
|
||||
.attr('y2', radius * config.axisScaleFactor * Math.sin(angle))
|
||||
.attr('class', 'radarAxisLine');
|
||||
g.append('text')
|
||||
.text(label)
|
||||
.attr('x', radius * config.axisLabelFactor * Math.cos(angle))
|
||||
.attr('y', radius * config.axisLabelFactor * Math.sin(angle))
|
||||
.attr('class', 'radarAxisLabel');
|
||||
}
|
||||
};
|
||||
|
||||
function drawCurves(
|
||||
g: SVGGroup,
|
||||
axes: RadarAxis[],
|
||||
curves: RadarCurve[],
|
||||
minValue: number,
|
||||
maxValue: number,
|
||||
graticule: string,
|
||||
config: Required<RadarDiagramConfig>
|
||||
) {
|
||||
const numAxes = axes.length;
|
||||
const radius = Math.min(config.width, config.height) / 2;
|
||||
|
||||
curves.forEach((curve, index) => {
|
||||
if (curve.entries.length !== numAxes) {
|
||||
// Skip curves that do not have an entry for each axis.
|
||||
return;
|
||||
}
|
||||
// Compute points for the curve.
|
||||
const points = curve.entries.map((entry, i) => {
|
||||
const angle = (2 * Math.PI * i) / numAxes - Math.PI / 2;
|
||||
const r = relativeRadius(entry, minValue, maxValue, radius);
|
||||
const x = r * Math.cos(angle);
|
||||
const y = r * Math.sin(angle);
|
||||
return { x, y };
|
||||
});
|
||||
|
||||
if (graticule === 'circle') {
|
||||
// Draw a closed curve through the points.
|
||||
g.append('path')
|
||||
.attr('d', closedRoundCurve(points, config.curveTension))
|
||||
.attr('class', `radarCurve-${index}`);
|
||||
} else if (graticule === 'polygon') {
|
||||
// Draw a polygon for each curve.
|
||||
g.append('polygon')
|
||||
.attr('points', points.map((p) => `${p.x},${p.y}`).join(' '))
|
||||
.attr('class', `radarCurve-${index}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export function relativeRadius(
|
||||
value: number,
|
||||
minValue: number,
|
||||
maxValue: number,
|
||||
radius: number
|
||||
): number {
|
||||
const clippedValue = Math.min(Math.max(value, minValue), maxValue);
|
||||
return (radius * (clippedValue - minValue)) / (maxValue - minValue);
|
||||
}
|
||||
|
||||
export function closedRoundCurve(points: { x: number; y: number }[], tension: number): string {
|
||||
// Catmull-Rom spline helper function
|
||||
const numPoints = points.length;
|
||||
let d = `M${points[0].x},${points[0].y}`;
|
||||
// For each segment from point i to point (i+1) mod n, compute control points.
|
||||
for (let i = 0; i < numPoints; i++) {
|
||||
const p0 = points[(i - 1 + numPoints) % numPoints];
|
||||
const p1 = points[i];
|
||||
const p2 = points[(i + 1) % numPoints];
|
||||
const p3 = points[(i + 2) % numPoints];
|
||||
// Calculate the control points for the cubic Bezier segment
|
||||
const cp1 = {
|
||||
x: p1.x + (p2.x - p0.x) * tension,
|
||||
y: p1.y + (p2.y - p0.y) * tension,
|
||||
};
|
||||
const cp2 = {
|
||||
x: p2.x - (p3.x - p1.x) * tension,
|
||||
y: p2.y - (p3.y - p1.y) * tension,
|
||||
};
|
||||
d += ` C${cp1.x},${cp1.y} ${cp2.x},${cp2.y} ${p2.x},${p2.y}`;
|
||||
}
|
||||
return `${d} Z`;
|
||||
}
|
||||
|
||||
function drawLegend(
|
||||
g: SVGGroup,
|
||||
curves: RadarCurve[],
|
||||
showLegend: boolean,
|
||||
config: Required<RadarDiagramConfig>
|
||||
) {
|
||||
if (!showLegend) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Create a legend group and position it in the top-right corner of the chart.
|
||||
const legendX = ((config.width / 2 + config.marginRight) * 3) / 4;
|
||||
const legendY = (-(config.height / 2 + config.marginTop) * 3) / 4;
|
||||
const lineHeight = 20;
|
||||
|
||||
curves.forEach((curve, index) => {
|
||||
const itemGroup = g
|
||||
.append('g')
|
||||
.attr('transform', `translate(${legendX}, ${legendY + index * lineHeight})`);
|
||||
|
||||
// Draw a square marker for this curve.
|
||||
itemGroup
|
||||
.append('rect')
|
||||
.attr('width', 12)
|
||||
.attr('height', 12)
|
||||
.attr('class', `radarLegendBox-${index}`);
|
||||
|
||||
// Draw the label text next to the marker.
|
||||
itemGroup
|
||||
.append('text')
|
||||
.attr('x', 16)
|
||||
.attr('y', 0)
|
||||
.attr('class', 'radarLegendText')
|
||||
.text(curve.label);
|
||||
});
|
||||
}
|
||||
|
||||
export const renderer: DiagramRenderer = { draw };
|
77
packages/mermaid/src/diagrams/radar/styles.ts
Normal file
77
packages/mermaid/src/diagrams/radar/styles.ts
Normal file
@@ -0,0 +1,77 @@
|
||||
import type { DiagramStylesProvider } from '../../diagram-api/types.js';
|
||||
import { cleanAndMerge } from '../../utils.js';
|
||||
import type { RadarStyleOptions } from './types.js';
|
||||
import { getThemeVariables } from '../../themes/theme-default.js';
|
||||
import { getConfig as getConfigAPI } from '../../config.js';
|
||||
|
||||
const genIndexStyles = (
|
||||
themeVariables: ReturnType<typeof getThemeVariables>,
|
||||
radarOptions: RadarStyleOptions
|
||||
) => {
|
||||
let sections = '';
|
||||
for (let i = 0; i < themeVariables.THEME_COLOR_LIMIT; i++) {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
const indexColor = (themeVariables as any)[`cScale${i}`];
|
||||
sections += `
|
||||
.radarCurve-${i} {
|
||||
color: ${indexColor};
|
||||
fill: ${indexColor};
|
||||
fill-opacity: ${radarOptions.curveOpacity};
|
||||
stroke: ${indexColor};
|
||||
stroke-width: ${radarOptions.curveStrokeWidth};
|
||||
}
|
||||
.radarLegendBox-${i} {
|
||||
fill: ${indexColor};
|
||||
fill-opacity: ${radarOptions.curveOpacity};
|
||||
stroke: ${indexColor};
|
||||
}
|
||||
`;
|
||||
}
|
||||
return sections;
|
||||
};
|
||||
|
||||
export const buildRadarStyleOptions = (radar?: RadarStyleOptions) => {
|
||||
const defaultThemeVariables = getThemeVariables();
|
||||
const currentConfig = getConfigAPI();
|
||||
|
||||
const themeVariables = cleanAndMerge(defaultThemeVariables, currentConfig.themeVariables);
|
||||
const radarOptions: RadarStyleOptions = cleanAndMerge(themeVariables.radar, radar);
|
||||
|
||||
return { themeVariables, radarOptions };
|
||||
};
|
||||
|
||||
export const styles: DiagramStylesProvider = ({ radar }: { radar?: RadarStyleOptions } = {}) => {
|
||||
const { themeVariables, radarOptions } = buildRadarStyleOptions(radar);
|
||||
return `
|
||||
.radarTitle {
|
||||
font-size: ${themeVariables.fontSize};
|
||||
color: ${themeVariables.titleColor};
|
||||
dominant-baseline: hanging;
|
||||
text-anchor: middle;
|
||||
}
|
||||
.radarAxisLine {
|
||||
stroke: ${radarOptions.axisColor};
|
||||
stroke-width: ${radarOptions.axisStrokeWidth};
|
||||
}
|
||||
.radarAxisLabel {
|
||||
dominant-baseline: middle;
|
||||
text-anchor: middle;
|
||||
font-size: ${radarOptions.axisLabelFontSize}px;
|
||||
color: ${radarOptions.axisColor};
|
||||
}
|
||||
.radarGraticule {
|
||||
fill: ${radarOptions.graticuleColor};
|
||||
fill-opacity: ${radarOptions.graticuleOpacity};
|
||||
stroke: ${radarOptions.graticuleColor};
|
||||
stroke-width: ${radarOptions.graticuleStrokeWidth};
|
||||
}
|
||||
.radarLegendText {
|
||||
text-anchor: start;
|
||||
font-size: ${radarOptions.legendFontSize}px;
|
||||
dominant-baseline: hanging;
|
||||
}
|
||||
${genIndexStyles(themeVariables, radarOptions)}
|
||||
`;
|
||||
};
|
||||
|
||||
export default styles;
|
47
packages/mermaid/src/diagrams/radar/types.ts
Normal file
47
packages/mermaid/src/diagrams/radar/types.ts
Normal file
@@ -0,0 +1,47 @@
|
||||
import type { Axis, Curve, Option } from '../../../../parser/dist/src/language/generated/ast.js';
|
||||
import type { RadarDiagramConfig } from '../../config.type.js';
|
||||
import type { DiagramDBBase } from '../../diagram-api/types.js';
|
||||
|
||||
export interface RadarAxis {
|
||||
name: string;
|
||||
label: string;
|
||||
}
|
||||
export interface RadarCurve {
|
||||
name: string;
|
||||
entries: number[];
|
||||
label: string;
|
||||
}
|
||||
export interface RadarOptions {
|
||||
showLegend: boolean;
|
||||
ticks: number;
|
||||
max: number | null;
|
||||
min: number;
|
||||
graticule: 'circle' | 'polygon';
|
||||
}
|
||||
export interface RadarDB extends DiagramDBBase<RadarDiagramConfig> {
|
||||
getAxes: () => RadarAxis[];
|
||||
getCurves: () => RadarCurve[];
|
||||
getOptions: () => RadarOptions;
|
||||
setAxes: (axes: Axis[]) => void;
|
||||
setCurves: (curves: Curve[]) => void;
|
||||
setOptions: (options: Option[]) => void;
|
||||
}
|
||||
|
||||
export interface RadarStyleOptions {
|
||||
axisColor?: string;
|
||||
axisStrokeWidth?: number;
|
||||
axisLabelFontSize?: number;
|
||||
curveOpacity?: number;
|
||||
curveStrokeWidth?: number;
|
||||
graticuleColor?: string;
|
||||
graticuleOpacity?: number;
|
||||
graticuleStrokeWidth?: number;
|
||||
legendBoxSize?: number;
|
||||
legendFontSize?: number;
|
||||
}
|
||||
|
||||
export interface RadarData {
|
||||
axes: RadarAxis[];
|
||||
curves: RadarCurve[];
|
||||
options: RadarOptions;
|
||||
}
|
@@ -328,7 +328,8 @@ export class RequirementDB implements DiagramDB {
|
||||
thickness: 'normal',
|
||||
type: 'normal',
|
||||
pattern: isContains ? 'normal' : 'dashed',
|
||||
arrowTypeEnd: isContains ? 'requirement_contains' : 'requirement_arrow',
|
||||
arrowTypeStart: isContains ? 'requirement_contains' : '',
|
||||
arrowTypeEnd: isContains ? '' : 'requirement_arrow',
|
||||
look: config.look,
|
||||
};
|
||||
|
||||
|
@@ -1679,7 +1679,6 @@ Alice->Bob: Hello Bob, how are you?`;
|
||||
|
||||
const diagram = await Diagram.fromText(str);
|
||||
await diagram.renderer.draw(str, 'tst', '1.2.3', diagram);
|
||||
|
||||
const { bounds, models } = diagram.renderer.bounds.getBounds();
|
||||
expect(bounds.startx).toBe(0);
|
||||
expect(bounds.starty).toBe(0);
|
||||
|
@@ -6,38 +6,122 @@ interface Taglines {
|
||||
url: string;
|
||||
}
|
||||
|
||||
const taglines: Taglines[] = [
|
||||
{
|
||||
label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/mermaid-ai?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=aibundle',
|
||||
const allTaglines: { [key: string]: { design: number; taglines: Taglines[] } } = {
|
||||
A: {
|
||||
design: 1,
|
||||
taglines: [
|
||||
{
|
||||
label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_A',
|
||||
},
|
||||
{
|
||||
label: 'Diagram live with teammates in Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_A',
|
||||
},
|
||||
{
|
||||
label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_A',
|
||||
},
|
||||
{
|
||||
label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
|
||||
url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: 'Diagram live with teammates in Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/landing?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=team_collaboration',
|
||||
B: {
|
||||
design: 2,
|
||||
taglines: [
|
||||
{
|
||||
label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_B',
|
||||
},
|
||||
{
|
||||
label: 'Diagram live with teammates in Mermaid Chart',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_B',
|
||||
},
|
||||
{
|
||||
label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_B',
|
||||
},
|
||||
{
|
||||
label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
|
||||
url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams',
|
||||
url: 'https://www.mermaidchart.com/landing?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor',
|
||||
C: {
|
||||
design: 1,
|
||||
taglines: [
|
||||
{
|
||||
label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_C',
|
||||
},
|
||||
{
|
||||
label: 'Diagram live with teammates in Mermaid Pro',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_C',
|
||||
},
|
||||
{
|
||||
label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_C',
|
||||
},
|
||||
{
|
||||
label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
|
||||
url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_A',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
|
||||
url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard',
|
||||
D: {
|
||||
design: 2,
|
||||
taglines: [
|
||||
{
|
||||
label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Pro',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=AIbundle_D',
|
||||
},
|
||||
{
|
||||
label: 'Diagram live with teammates in Mermaid Pro',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=teams_D',
|
||||
},
|
||||
{
|
||||
label: 'Use the Visual Editor in Mermaid Pro to design and build diagrams',
|
||||
url: 'https://www.mermaidchart.com/play?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=visual_editor_D',
|
||||
},
|
||||
{
|
||||
label: 'Explore the Mermaid Whiteboard from the creators of Mermaid',
|
||||
url: 'https://www.mermaidchart.com/whiteboard?utm_source=mermaid_js&utm_medium=banner_ad&utm_campaign=whiteboard_B',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
};
|
||||
|
||||
// Initialize with default values
|
||||
const design: Ref<number> = ref(1);
|
||||
const taglines: Ref<Taglines[]> = ref([]);
|
||||
const index: Ref<number> = ref(0);
|
||||
|
||||
let index = ref(Math.floor(Math.random() * taglines.length));
|
||||
onMounted(() => {
|
||||
// Select a random variant on client side
|
||||
const variant =
|
||||
Object.values(allTaglines)[Math.floor(Math.random() * Object.values(allTaglines).length)];
|
||||
design.value = variant.design;
|
||||
taglines.value = variant.taglines;
|
||||
index.value = Math.floor(Math.random() * taglines.value.length);
|
||||
|
||||
// Set up the interval for cycling through taglines
|
||||
setInterval(() => {
|
||||
index.value = (index.value + 1) % taglines.length;
|
||||
index.value = (index.value + 1) % taglines.value.length;
|
||||
}, 5_000);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="mb-4 w-full top-bar flex p-2 bg-[#E0095F]">
|
||||
<div
|
||||
:class="[design === 1 ? 'bg-gradient-to-r from-[#bd34fe] to-[#ff3670] ' : 'bg-[#E0095F]']"
|
||||
class="mb-4 w-full top-bar flex p-2"
|
||||
>
|
||||
<p class="w-full tracking-wide fade-text text-sm">
|
||||
<transition name="fade" mode="out-in">
|
||||
<a
|
||||
v-if="taglines.length > 0 && taglines[index]"
|
||||
:key="index"
|
||||
:href="taglines[index].url"
|
||||
target="_blank"
|
||||
|
@@ -159,6 +159,7 @@ function sidebarSyntax() {
|
||||
{ text: 'Packet 🔥', link: '/syntax/packet' },
|
||||
{ text: 'Kanban 🔥', link: '/syntax/kanban' },
|
||||
{ text: 'Architecture 🔥', link: '/syntax/architecture' },
|
||||
{ text: 'Radar 🔥', link: '/syntax/radar' },
|
||||
{ text: 'Other Examples', link: '/syntax/examples' },
|
||||
],
|
||||
},
|
||||
|
@@ -240,6 +240,22 @@ Code is the heart of every software project. We strive to make it better. Who if
|
||||
|
||||
The core of Mermaid is located under `packages/mermaid/src`.
|
||||
|
||||
### Building Mermaid Locally
|
||||
|
||||
**Host**
|
||||
|
||||
```bash
|
||||
pnpm run build
|
||||
```
|
||||
|
||||
**Docker**
|
||||
|
||||
```bash
|
||||
./run build
|
||||
```
|
||||
|
||||
This will build the Mermaid library and the documentation site.
|
||||
|
||||
### Running Mermaid Locally
|
||||
|
||||
**Host**
|
||||
|
198
packages/mermaid/src/docs/syntax/radar.md
Normal file
198
packages/mermaid/src/docs/syntax/radar.md
Normal file
@@ -0,0 +1,198 @@
|
||||
# Radar Diagram (v11.6.0+)
|
||||
|
||||
## Introduction
|
||||
|
||||
A radar diagram is a simple way to plot low-dimensional data in a circular format.
|
||||
|
||||
It is also known as a **radar chart**, **spider chart**, **star chart**, **cobweb chart**, **polar chart**, or **Kiviat diagram**.
|
||||
|
||||
## Usage
|
||||
|
||||
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.
|
||||
|
||||
It is commonly used to graphically summarize and compare the performance of multiple entities across multiple dimensions.
|
||||
|
||||
## Syntax
|
||||
|
||||
```md
|
||||
radar-beta
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
... More Fields ...
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
```mermaid-example
|
||||
---
|
||||
title: "Grades"
|
||||
---
|
||||
radar-beta
|
||||
axis m["Math"], s["Science"], e["English"]
|
||||
axis h["History"], g["Geography"], a["Art"]
|
||||
curve a["Alice"]{85, 90, 80, 70, 75, 90}
|
||||
curve b["Bob"]{70, 75, 85, 80, 90, 85}
|
||||
|
||||
max 100
|
||||
min 0
|
||||
```
|
||||
|
||||
```mermaid-example
|
||||
radar-beta
|
||||
title Restaurant Comparison
|
||||
axis food["Food Quality"], service["Service"], price["Price"]
|
||||
axis ambiance["Ambiance"],
|
||||
|
||||
curve a["Restaurant A"]{4, 3, 2, 4}
|
||||
curve b["Restaurant B"]{3, 4, 3, 3}
|
||||
curve c["Restaurant C"]{2, 3, 4, 2}
|
||||
curve d["Restaurant D"]{2, 2, 4, 3}
|
||||
|
||||
graticule polygon
|
||||
max 5
|
||||
|
||||
```
|
||||
|
||||
## Details of Syntax
|
||||
|
||||
### Title
|
||||
|
||||
`title`: The title is an optional field that allows to render a title at the top of the radar diagram.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
title Title of the Radar Diagram
|
||||
...
|
||||
```
|
||||
|
||||
### Axis
|
||||
|
||||
`axis`: The axis keyword is used to define the axes of the radar diagram.
|
||||
|
||||
Each axis is represented by an ID and an optional label.
|
||||
|
||||
Multiple axes can be defined in a single line.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
axis id1["Label1"]
|
||||
axis id2["Label2"], id3["Label3"]
|
||||
...
|
||||
```
|
||||
|
||||
### Curve
|
||||
|
||||
`curve`: The curve keyword is used to define the data points for a curve in the radar diagram.
|
||||
|
||||
Each curve is represented by an ID, an optional label, and a list of values.
|
||||
|
||||
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.
|
||||
|
||||
Multiple curves can be defined in a single line.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
axis axis1, axis2, axis3
|
||||
curve id1["Label1"]{1, 2, 3}
|
||||
curve id2["Label2"]{4, 5, 6}, id3{7, 8, 9}
|
||||
curve id4{ axis3: 30, axis1: 20, axis2: 10 }
|
||||
...
|
||||
```
|
||||
|
||||
### Options
|
||||
|
||||
- `showLegend`: The showLegend keyword is used to show or hide the legend in the radar diagram. The legend is shown by default.
|
||||
- `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.
|
||||
- `min`: The minimum value for the radar diagram. This is used to scale the radar diagram. If not provided, the minimum value is `0`.
|
||||
- `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`.
|
||||
- `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`.
|
||||
|
||||
```
|
||||
radar-beta
|
||||
...
|
||||
showLegend true
|
||||
max 100
|
||||
min 0
|
||||
graticule circle
|
||||
ticks 5
|
||||
...
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
Please refer to the [configuration](/config/schema-docs/config-defs-radar-diagram-config.html) guide for details.
|
||||
|
||||
| Parameter | Description | Default Value |
|
||||
| --------------- | ---------------------------------------- | ------------- |
|
||||
| width | Width of the radar diagram | `600` |
|
||||
| height | Height of the radar diagram | `600` |
|
||||
| marginTop | Top margin of the radar diagram | `50` |
|
||||
| marginBottom | Bottom margin of the radar diagram | `50` |
|
||||
| marginLeft | Left margin of the radar diagram | `50` |
|
||||
| marginRight | Right margin of the radar diagram | `50` |
|
||||
| axisScaleFactor | Scale factor for the axis | `1` |
|
||||
| axisLabelFactor | Factor to adjust the axis label position | `1.05` |
|
||||
| curveTension | Tension for the rounded curves | `0.17` |
|
||||
|
||||
## Theme Variables
|
||||
|
||||
### Global Theme Variables
|
||||
|
||||
```note
|
||||
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:
|
||||
%%{init: {"themeVariables": {"cScale0": "#FF0000", "cScale1": "#00FF00"}} }%%
|
||||
```
|
||||
|
||||
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`.
|
||||
|
||||
| Property | Description |
|
||||
| ---------- | ------------------------------ |
|
||||
| fontSize | Font size of the title |
|
||||
| titleColor | Color of the title |
|
||||
| cScale${i} | Color scale for the i-th curve |
|
||||
|
||||
### Radar Style Options
|
||||
|
||||
```note
|
||||
Specific variables for radar resides inside the `radar` key. To set the radar style options, use this syntax.
|
||||
%%{init: {"themeVariables": {"radar": {"axisColor": "#FF0000"}} } }%%
|
||||
```
|
||||
|
||||
| Property | Description | Default Value |
|
||||
| -------------------- | ---------------------------- | ------------- |
|
||||
| axisColor | Color of the axis lines | `black` |
|
||||
| axisStrokeWidth | Width of the axis lines | `1` |
|
||||
| axisLabelFontSize | Font size of the axis labels | `12px` |
|
||||
| curveOpacity | Opacity of the curves | `0.7` |
|
||||
| curveStrokeWidth | Width of the curves | `2` |
|
||||
| graticuleColor | Color of the graticule | `black` |
|
||||
| graticuleOpacity | Opacity of the graticule | `0.5` |
|
||||
| graticuleStrokeWidth | Width of the graticule | `1` |
|
||||
| legendBoxSize | Size of the legend box | `10` |
|
||||
| legendFontSize | Font size of the legend | `14px` |
|
||||
|
||||
## Example on config and theme
|
||||
|
||||
```mermaid-example
|
||||
---
|
||||
config:
|
||||
radar:
|
||||
axisScaleFactor: 0.25
|
||||
curveTension: 0.1
|
||||
theme: base
|
||||
themeVariables:
|
||||
cScale0: "#FF0000"
|
||||
cScale1: "#00FF00"
|
||||
cScale2: "#0000FF"
|
||||
radar:
|
||||
curveOpacity: 0
|
||||
---
|
||||
radar-beta
|
||||
axis A, B, C, D, E
|
||||
curve c1{1,2,3,4,5}
|
||||
curve c2{5,4,3,2,1}
|
||||
curve c3{3,3,3,3,3}
|
||||
```
|
||||
|
||||
<!--- cspell:ignore Kiviat --->
|
@@ -30,6 +30,7 @@ vi.mock('./diagrams/packet/renderer.js');
|
||||
vi.mock('./diagrams/xychart/xychartRenderer.js');
|
||||
vi.mock('./diagrams/requirement/requirementRenderer.js');
|
||||
vi.mock('./diagrams/sequence/sequenceRenderer.js');
|
||||
vi.mock('./diagrams/radar/renderer.js');
|
||||
|
||||
// -------------------------------------
|
||||
|
||||
@@ -797,6 +798,7 @@ graph TD;A--x|text including URL space|B;`)
|
||||
{ textDiagramType: 'requirementDiagram', expectedType: 'requirement' },
|
||||
{ textDiagramType: 'sequenceDiagram', expectedType: 'sequence' },
|
||||
{ textDiagramType: 'stateDiagram-v2', expectedType: 'stateDiagram' },
|
||||
{ textDiagramType: 'radar-beta', expectedType: 'radar' },
|
||||
];
|
||||
|
||||
describe('accessibility', () => {
|
||||
|
@@ -6,7 +6,22 @@ import utils from '../../utils.js';
|
||||
import { getLineFunctionsWithOffset } from '../../utils/lineWithOffset.js';
|
||||
import { getSubGraphTitleMargins } from '../../utils/subGraphTitleMargins.js';
|
||||
|
||||
import { curveBasis, curveLinear, curveCardinal, line, select } from 'd3';
|
||||
import {
|
||||
curveBasis,
|
||||
curveLinear,
|
||||
curveCardinal,
|
||||
curveBumpX,
|
||||
curveBumpY,
|
||||
curveCatmullRom,
|
||||
curveMonotoneX,
|
||||
curveMonotoneY,
|
||||
curveNatural,
|
||||
curveStep,
|
||||
curveStepAfter,
|
||||
curveStepBefore,
|
||||
line,
|
||||
select,
|
||||
} from 'd3';
|
||||
import rough from 'roughjs';
|
||||
import createLabel from './createLabel.js';
|
||||
import { addEdgeMarkers } from './edgeMarker.ts';
|
||||
@@ -484,6 +499,33 @@ export const insertEdge = function (elem, edge, clusterDb, diagramType, startNod
|
||||
case 'cardinal':
|
||||
curve = curveCardinal;
|
||||
break;
|
||||
case 'bumpX':
|
||||
curve = curveBumpX;
|
||||
break;
|
||||
case 'bumpY':
|
||||
curve = curveBumpY;
|
||||
break;
|
||||
case 'catmullRom':
|
||||
curve = curveCatmullRom;
|
||||
break;
|
||||
case 'monotoneX':
|
||||
curve = curveMonotoneX;
|
||||
break;
|
||||
case 'monotoneY':
|
||||
curve = curveMonotoneY;
|
||||
break;
|
||||
case 'natural':
|
||||
curve = curveNatural;
|
||||
break;
|
||||
case 'step':
|
||||
curve = curveStep;
|
||||
break;
|
||||
case 'stepAfter':
|
||||
curve = curveStepAfter;
|
||||
break;
|
||||
case 'stepBefore':
|
||||
curve = curveStepBefore;
|
||||
break;
|
||||
default:
|
||||
curve = curveBasis;
|
||||
}
|
||||
|
@@ -423,19 +423,19 @@ const requirement_contains = (elem, type, id) => {
|
||||
const containsNode = elem
|
||||
.append('defs')
|
||||
.append('marker')
|
||||
.attr('id', id + '_' + type + '-requirement_containsEnd')
|
||||
.attr('refX', 20)
|
||||
.attr('id', id + '_' + type + '-requirement_containsStart')
|
||||
.attr('refX', 0)
|
||||
.attr('refY', 10)
|
||||
.attr('markerWidth', 20)
|
||||
.attr('markerHeight', 20)
|
||||
.attr('orient', 'auto')
|
||||
.append('g');
|
||||
|
||||
containsNode.append('circle').attr('cx', 10).attr('cy', 10).attr('r', 10).attr('fill', 'none');
|
||||
containsNode.append('circle').attr('cx', 10).attr('cy', 10).attr('r', 9).attr('fill', 'none');
|
||||
|
||||
containsNode.append('line').attr('x1', 0).attr('x2', 20).attr('y1', 10).attr('y2', 10);
|
||||
containsNode.append('line').attr('x1', 1).attr('x2', 19).attr('y1', 10).attr('y2', 10);
|
||||
|
||||
containsNode.append('line').attr('y1', 0).attr('y2', 20).attr('x1', 10).attr('x2', 10);
|
||||
containsNode.append('line').attr('y1', 1).attr('y2', 19).attr('x1', 10).attr('x2', 10);
|
||||
};
|
||||
|
||||
// TODO rename the class diagram markers to something shape descriptive and semantic free
|
||||
|
@@ -55,6 +55,7 @@ required:
|
||||
- packet
|
||||
- block
|
||||
- look
|
||||
- radar
|
||||
properties:
|
||||
theme:
|
||||
description: |
|
||||
@@ -292,6 +293,8 @@ properties:
|
||||
$ref: '#/$defs/PacketDiagramConfig'
|
||||
block:
|
||||
$ref: '#/$defs/BlockDiagramConfig'
|
||||
radar:
|
||||
$ref: '#/$defs/RadarDiagramConfig'
|
||||
dompurifyConfig:
|
||||
title: DOM Purify Configuration
|
||||
description: Configuration options to pass to the `dompurify` library.
|
||||
@@ -2063,7 +2066,21 @@ $defs: # JSON Schema definition (maybe we should move these to a separate file)
|
||||
description: |
|
||||
Defines how mermaid renders curves for flowcharts.
|
||||
type: string
|
||||
enum: ['basis', 'linear', 'cardinal']
|
||||
enum:
|
||||
[
|
||||
'basis',
|
||||
'bumpX',
|
||||
'bumpY',
|
||||
'cardinal',
|
||||
'catmullRom',
|
||||
'linear',
|
||||
'monotoneX',
|
||||
'monotoneY',
|
||||
'natural',
|
||||
'step',
|
||||
'stepAfter',
|
||||
'stepBefore',
|
||||
]
|
||||
default: 'basis'
|
||||
padding:
|
||||
description: |
|
||||
@@ -2208,6 +2225,60 @@ $defs: # JSON Schema definition (maybe we should move these to a separate file)
|
||||
minimum: 0
|
||||
default: 8
|
||||
|
||||
RadarDiagramConfig:
|
||||
title: Radar Diagram Config
|
||||
allOf: [{ $ref: '#/$defs/BaseDiagramConfig' }]
|
||||
description: The object containing configurations specific for radar diagrams.
|
||||
type: object
|
||||
unevaluatedProperties: false
|
||||
properties:
|
||||
width:
|
||||
description: The size of the radar diagram.
|
||||
type: number
|
||||
minimum: 1
|
||||
default: 600
|
||||
height:
|
||||
description: The size of the radar diagram.
|
||||
type: number
|
||||
minimum: 1
|
||||
default: 600
|
||||
marginTop:
|
||||
description: The margin from the top of the radar diagram.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 50
|
||||
marginRight:
|
||||
description: The margin from the right of the radar diagram.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 50
|
||||
marginBottom:
|
||||
description: The margin from the bottom of the radar diagram.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 50
|
||||
marginLeft:
|
||||
description: The margin from the left of the radar diagram.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 50
|
||||
axisScaleFactor:
|
||||
description: The scale factor of the axis.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 1
|
||||
axisLabelFactor:
|
||||
description: The scale factor of the axis label.
|
||||
type: number
|
||||
minimum: 0
|
||||
default: 1.05
|
||||
curveTension:
|
||||
description: The tension factor for the Catmull-Rom spline conversion to cubic Bézier curves.
|
||||
type: number
|
||||
minimum: 0
|
||||
maximum: 1
|
||||
default: 0.17
|
||||
|
||||
FontCalculator:
|
||||
title: Font Calculator
|
||||
description: |
|
||||
|
@@ -29,6 +29,7 @@ import timeline from './diagrams/timeline/styles.js';
|
||||
import mindmap from './diagrams/mindmap/styles.js';
|
||||
import packet from './diagrams/packet/styles.js';
|
||||
import block from './diagrams/block/styles.js';
|
||||
import radar from './diagrams/radar/styles.js';
|
||||
import themes from './themes/index.js';
|
||||
|
||||
function checkValidStylisCSSStyleSheet(stylisString: string) {
|
||||
@@ -99,6 +100,7 @@ describe('styles', () => {
|
||||
block,
|
||||
timeline,
|
||||
packet,
|
||||
radar,
|
||||
})) {
|
||||
test(`should return a valid style for diagram ${diagramId} and theme ${themeId}`, async () => {
|
||||
const { default: getStyles, addStylesForDiagram } = await import('./styles.js');
|
||||
|
@@ -230,6 +230,20 @@ class Theme {
|
||||
this.pieOuterStrokeColor = this.pieOuterStrokeColor || 'black';
|
||||
this.pieOpacity = this.pieOpacity || '0.7';
|
||||
|
||||
/* radar */
|
||||
this.radar = {
|
||||
axisColor: this.radar?.axisColor || this.lineColor,
|
||||
axisStrokeWidth: this.radar?.axisStrokeWidth || 2,
|
||||
axisLabelFontSize: this.radar?.axisLabelFontSize || 12,
|
||||
curveOpacity: this.radar?.curveOpacity || 0.5,
|
||||
curveStrokeWidth: this.radar?.curveStrokeWidth || 2,
|
||||
graticuleColor: this.radar?.graticuleColor || '#DEDEDE',
|
||||
graticuleStrokeWidth: this.radar?.graticuleStrokeWidth || 1,
|
||||
graticuleOpacity: this.radar?.graticuleOpacity || 0.3,
|
||||
legendBoxSize: this.radar?.legendBoxSize || 12,
|
||||
legendFontSize: this.radar?.legendFontSize || 12,
|
||||
};
|
||||
|
||||
/* architecture */
|
||||
this.archEdgeColor = this.archEdgeColor || '#777';
|
||||
this.archEdgeArrowColor = this.archEdgeArrowColor || '#777';
|
||||
|
@@ -291,6 +291,20 @@ class Theme {
|
||||
blockFillColor: this.background,
|
||||
};
|
||||
|
||||
/* radar */
|
||||
this.radar = {
|
||||
axisColor: this.radar?.axisColor || this.lineColor,
|
||||
axisStrokeWidth: this.radar?.axisStrokeWidth || 2,
|
||||
axisLabelFontSize: this.radar?.axisLabelFontSize || 12,
|
||||
curveOpacity: this.radar?.curveOpacity || 0.5,
|
||||
curveStrokeWidth: this.radar?.curveStrokeWidth || 2,
|
||||
graticuleColor: this.radar?.graticuleColor || '#DEDEDE',
|
||||
graticuleStrokeWidth: this.radar?.graticuleStrokeWidth || 1,
|
||||
graticuleOpacity: this.radar?.graticuleOpacity || 0.3,
|
||||
legendBoxSize: this.radar?.legendBoxSize || 12,
|
||||
legendFontSize: this.radar?.legendFontSize || 12,
|
||||
};
|
||||
|
||||
/* class */
|
||||
this.classText = this.primaryTextColor;
|
||||
|
||||
|
@@ -291,6 +291,20 @@ class Theme {
|
||||
this.quadrantExternalBorderStrokeFill || this.primaryBorderColor;
|
||||
this.quadrantTitleFill = this.quadrantTitleFill || this.primaryTextColor;
|
||||
|
||||
/* radar */
|
||||
this.radar = {
|
||||
axisColor: this.radar?.axisColor || this.lineColor,
|
||||
axisStrokeWidth: this.radar?.axisStrokeWidth || 2,
|
||||
axisLabelFontSize: this.radar?.axisLabelFontSize || 12,
|
||||
curveOpacity: this.radar?.curveOpacity || 0.5,
|
||||
curveStrokeWidth: this.radar?.curveStrokeWidth || 2,
|
||||
graticuleColor: this.radar?.graticuleColor || '#DEDEDE',
|
||||
graticuleStrokeWidth: this.radar?.graticuleStrokeWidth || 1,
|
||||
graticuleOpacity: this.radar?.graticuleOpacity || 0.3,
|
||||
legendBoxSize: this.radar?.legendBoxSize || 12,
|
||||
legendFontSize: this.radar?.legendFontSize || 12,
|
||||
};
|
||||
|
||||
/* xychart */
|
||||
this.xyChart = {
|
||||
backgroundColor: this.xyChart?.backgroundColor || this.background,
|
||||
|
@@ -265,6 +265,20 @@ class Theme {
|
||||
blockFillColor: this.mainBkg,
|
||||
};
|
||||
|
||||
/* radar */
|
||||
this.radar = {
|
||||
axisColor: this.radar?.axisColor || this.lineColor,
|
||||
axisStrokeWidth: this.radar?.axisStrokeWidth || 2,
|
||||
axisLabelFontSize: this.radar?.axisLabelFontSize || 12,
|
||||
curveOpacity: this.radar?.curveOpacity || 0.5,
|
||||
curveStrokeWidth: this.radar?.curveStrokeWidth || 2,
|
||||
graticuleColor: this.radar?.graticuleColor || '#DEDEDE',
|
||||
graticuleStrokeWidth: this.radar?.graticuleStrokeWidth || 1,
|
||||
graticuleOpacity: this.radar?.graticuleOpacity || 0.3,
|
||||
legendBoxSize: this.radar?.legendBoxSize || 12,
|
||||
legendFontSize: this.radar?.legendFontSize || 12,
|
||||
};
|
||||
|
||||
/* xychart */
|
||||
this.xyChart = {
|
||||
backgroundColor: this.xyChart?.backgroundColor || this.background,
|
||||
|
@@ -303,6 +303,20 @@ class Theme {
|
||||
'#EEE,#6BB8E4,#8ACB88,#C7ACD6,#E8DCC2,#FFB2A8,#FFF380,#7E8D91,#FFD8B1,#FAF3E0',
|
||||
};
|
||||
|
||||
/* radar */
|
||||
this.radar = {
|
||||
axisColor: this.radar?.axisColor || this.lineColor,
|
||||
axisStrokeWidth: this.radar?.axisStrokeWidth || 2,
|
||||
axisLabelFontSize: this.radar?.axisLabelFontSize || 12,
|
||||
curveOpacity: this.radar?.curveOpacity || 0.5,
|
||||
curveStrokeWidth: this.radar?.curveStrokeWidth || 2,
|
||||
graticuleColor: this.radar?.graticuleColor || '#DEDEDE',
|
||||
graticuleStrokeWidth: this.radar?.graticuleStrokeWidth || 1,
|
||||
graticuleOpacity: this.radar?.graticuleOpacity || 0.3,
|
||||
legendBoxSize: this.radar?.legendBoxSize || 12,
|
||||
legendFontSize: this.radar?.legendFontSize || 12,
|
||||
};
|
||||
|
||||
/* requirement-diagram */
|
||||
this.requirementBackground = this.requirementBackground || this.primaryColor;
|
||||
this.requirementBorderColor = this.requirementBorderColor || this.primaryBorderColor;
|
||||
|
@@ -1,5 +1,11 @@
|
||||
# @mermaid-js/parser
|
||||
|
||||
## 0.4.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- [#6381](https://github.com/mermaid-js/mermaid/pull/6381) [`95d73bc`](https://github.com/mermaid-js/mermaid/commit/95d73bc3f064dbf261a06483f94a7ef4d0bb52eb) Thanks [@thomascizeron](https://github.com/thomascizeron)! - Add Radar Chart
|
||||
|
||||
## 0.3.0
|
||||
|
||||
### Minor Changes
|
||||
|
@@ -25,6 +25,11 @@
|
||||
"id": "gitGraph",
|
||||
"grammar": "src/language/gitGraph/gitGraph.langium",
|
||||
"fileExtensions": [".mmd", ".mermaid"]
|
||||
},
|
||||
{
|
||||
"id": "radar",
|
||||
"grammar": "src/language/radar/radar.langium",
|
||||
"fileExtensions": [".mmd", ".mermaid"]
|
||||
}
|
||||
],
|
||||
"mode": "production",
|
||||
|
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@mermaid-js/parser",
|
||||
"version": "0.3.0",
|
||||
"version": "0.4.0",
|
||||
"description": "MermaidJS parser",
|
||||
"author": "Yokozuna59",
|
||||
"contributors": [
|
||||
|
@@ -7,6 +7,7 @@ export {
|
||||
PieSection,
|
||||
Architecture,
|
||||
GitGraph,
|
||||
Radar,
|
||||
Branch,
|
||||
Commit,
|
||||
Merge,
|
||||
@@ -31,6 +32,7 @@ export {
|
||||
PieGeneratedModule,
|
||||
ArchitectureGeneratedModule,
|
||||
GitGraphGeneratedModule,
|
||||
RadarGeneratedModule,
|
||||
} from './generated/module.js';
|
||||
|
||||
export * from './gitGraph/index.js';
|
||||
@@ -39,3 +41,4 @@ export * from './info/index.js';
|
||||
export * from './packet/index.js';
|
||||
export * from './pie/index.js';
|
||||
export * from './architecture/index.js';
|
||||
export * from './radar/index.js';
|
||||
|
1
packages/parser/src/language/radar/index.ts
Normal file
1
packages/parser/src/language/radar/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * from './module.js';
|
73
packages/parser/src/language/radar/module.ts
Normal file
73
packages/parser/src/language/radar/module.ts
Normal file
@@ -0,0 +1,73 @@
|
||||
import type {
|
||||
DefaultSharedCoreModuleContext,
|
||||
LangiumCoreServices,
|
||||
LangiumSharedCoreServices,
|
||||
Module,
|
||||
PartialLangiumCoreServices,
|
||||
} from 'langium';
|
||||
import {
|
||||
EmptyFileSystem,
|
||||
createDefaultCoreModule,
|
||||
createDefaultSharedCoreModule,
|
||||
inject,
|
||||
} from 'langium';
|
||||
import { CommonValueConverter } from '../common/valueConverter.js';
|
||||
import { MermaidGeneratedSharedModule, RadarGeneratedModule } from '../generated/module.js';
|
||||
import { RadarTokenBuilder } from './tokenBuilder.js';
|
||||
|
||||
/**
|
||||
* Declaration of `Radar` services.
|
||||
*/
|
||||
interface RadarAddedServices {
|
||||
parser: {
|
||||
TokenBuilder: RadarTokenBuilder;
|
||||
ValueConverter: CommonValueConverter;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Union of Langium default services and `Radar` services.
|
||||
*/
|
||||
export type RadarServices = LangiumCoreServices & RadarAddedServices;
|
||||
|
||||
/**
|
||||
* Dependency injection module that overrides Langium default services and
|
||||
* contributes the declared `Radar` services.
|
||||
*/
|
||||
export const RadarModule: Module<RadarServices, PartialLangiumCoreServices & RadarAddedServices> = {
|
||||
parser: {
|
||||
TokenBuilder: () => new RadarTokenBuilder(),
|
||||
ValueConverter: () => new CommonValueConverter(),
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Create the full set of services required by Langium.
|
||||
*
|
||||
* First inject the shared services by merging two modules:
|
||||
* - Langium default shared services
|
||||
* - Services generated by langium-cli
|
||||
*
|
||||
* Then inject the language-specific services by merging three modules:
|
||||
* - Langium default language-specific services
|
||||
* - Services generated by langium-cli
|
||||
* - Services specified in this file
|
||||
* @param context - Optional module context with the LSP connection
|
||||
* @returns An object wrapping the shared services and the language-specific services
|
||||
*/
|
||||
export function createRadarServices(context: DefaultSharedCoreModuleContext = EmptyFileSystem): {
|
||||
shared: LangiumSharedCoreServices;
|
||||
Radar: RadarServices;
|
||||
} {
|
||||
const shared: LangiumSharedCoreServices = inject(
|
||||
createDefaultSharedCoreModule(context),
|
||||
MermaidGeneratedSharedModule
|
||||
);
|
||||
const Radar: RadarServices = inject(
|
||||
createDefaultCoreModule({ shared }),
|
||||
RadarGeneratedModule,
|
||||
RadarModule
|
||||
);
|
||||
shared.ServiceRegistry.register(Radar);
|
||||
return { shared, Radar };
|
||||
}
|
89
packages/parser/src/language/radar/radar.langium
Normal file
89
packages/parser/src/language/radar/radar.langium
Normal file
@@ -0,0 +1,89 @@
|
||||
grammar Radar
|
||||
// import "../common/common";
|
||||
// Note: The import statement breaks TitleAndAccessibilities probably because of terminal order definition
|
||||
// TODO: May need to change the common.langium to fix this
|
||||
|
||||
interface Common {
|
||||
accDescr?: string;
|
||||
accTitle?: string;
|
||||
title?: string;
|
||||
}
|
||||
|
||||
fragment TitleAndAccessibilities:
|
||||
((accDescr=ACC_DESCR | accTitle=ACC_TITLE | title=TITLE) EOL)+
|
||||
;
|
||||
|
||||
fragment EOL returns string:
|
||||
NEWLINE+ | EOF
|
||||
;
|
||||
|
||||
terminal NEWLINE: /\r?\n/;
|
||||
terminal ACC_DESCR: /[\t ]*accDescr(?:[\t ]*:([^\n\r]*?(?=%%)|[^\n\r]*)|\s*{([^}]*)})/;
|
||||
terminal ACC_TITLE: /[\t ]*accTitle[\t ]*:(?:[^\n\r]*?(?=%%)|[^\n\r]*)/;
|
||||
terminal TITLE: /[\t ]*title(?:[\t ][^\n\r]*?(?=%%)|[\t ][^\n\r]*|)/;
|
||||
|
||||
hidden terminal WHITESPACE: /[\t ]+/;
|
||||
hidden terminal YAML: /---[\t ]*\r?\n(?:[\S\s]*?\r?\n)?---(?:\r?\n|(?!\S))/;
|
||||
hidden terminal DIRECTIVE: /[\t ]*%%{[\S\s]*?}%%(?:\r?\n|(?!\S))/;
|
||||
hidden terminal SINGLE_LINE_COMMENT: /[\t ]*%%[^\n\r]*/;
|
||||
|
||||
entry Radar:
|
||||
NEWLINE*
|
||||
('radar-beta' | 'radar-beta:' | 'radar-beta' ':')
|
||||
NEWLINE*
|
||||
(
|
||||
TitleAndAccessibilities
|
||||
| 'axis' axes+=Axis (',' axes+=Axis)*
|
||||
| 'curve' curves+=Curve (',' curves+=Curve)*
|
||||
| options+=Option (',' options+=Option)*
|
||||
| NEWLINE
|
||||
)*
|
||||
;
|
||||
|
||||
fragment Label:
|
||||
'[' label=STRING ']'
|
||||
;
|
||||
|
||||
Axis:
|
||||
name=ID (Label)?
|
||||
;
|
||||
|
||||
Curve:
|
||||
name=ID (Label)? '{' Entries '}'
|
||||
;
|
||||
|
||||
fragment Entries:
|
||||
NEWLINE* entries+=NumberEntry (',' NEWLINE* entries+=NumberEntry)* NEWLINE* |
|
||||
NEWLINE* entries+=DetailedEntry (',' NEWLINE* entries+=DetailedEntry)* NEWLINE*
|
||||
;
|
||||
|
||||
interface Entry {
|
||||
axis?: @Axis;
|
||||
value: number;
|
||||
}
|
||||
DetailedEntry returns Entry:
|
||||
axis=[Axis:ID] ':'? value=NUMBER
|
||||
;
|
||||
NumberEntry returns Entry:
|
||||
value=NUMBER
|
||||
;
|
||||
|
||||
Option:
|
||||
(
|
||||
name='showLegend' value=BOOLEAN
|
||||
| name='ticks' value=NUMBER
|
||||
| name='max' value=NUMBER
|
||||
| name='min' value=NUMBER
|
||||
| name='graticule' value=GRATICULE
|
||||
)
|
||||
;
|
||||
|
||||
|
||||
terminal NUMBER returns number: /(0|[1-9][0-9]*)(\.[0-9]+)?/;
|
||||
|
||||
terminal BOOLEAN returns boolean: 'true' | 'false';
|
||||
|
||||
terminal GRATICULE returns string: 'circle' | 'polygon';
|
||||
|
||||
terminal ID returns string: /[a-zA-Z_][a-zA-Z0-9\-_]*/;
|
||||
terminal STRING: /"[^"]*"|'[^']*'/;
|
7
packages/parser/src/language/radar/tokenBuilder.ts
Normal file
7
packages/parser/src/language/radar/tokenBuilder.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { AbstractMermaidTokenBuilder } from '../common/index.js';
|
||||
|
||||
export class RadarTokenBuilder extends AbstractMermaidTokenBuilder {
|
||||
public constructor() {
|
||||
super(['radar-beta']);
|
||||
}
|
||||
}
|
@@ -1,8 +1,8 @@
|
||||
import type { LangiumParser, ParseResult } from 'langium';
|
||||
|
||||
import type { Info, Packet, Pie, Architecture, GitGraph } from './index.js';
|
||||
import type { Info, Packet, Pie, Architecture, GitGraph, Radar } from './index.js';
|
||||
|
||||
export type DiagramAST = Info | Packet | Pie | Architecture | GitGraph;
|
||||
export type DiagramAST = Info | Packet | Pie | Architecture | GitGraph | Radar;
|
||||
|
||||
const parsers: Record<string, LangiumParser> = {};
|
||||
const initializers = {
|
||||
@@ -31,6 +31,11 @@ const initializers = {
|
||||
const parser = createGitGraphServices().GitGraph.parser.LangiumParser;
|
||||
parsers.gitGraph = parser;
|
||||
},
|
||||
radar: async () => {
|
||||
const { createRadarServices } = await import('./language/radar/index.js');
|
||||
const parser = createRadarServices().Radar.parser.LangiumParser;
|
||||
parsers.radar = parser;
|
||||
},
|
||||
} as const;
|
||||
|
||||
export async function parse(diagramType: 'info', text: string): Promise<Info>;
|
||||
@@ -38,6 +43,7 @@ export async function parse(diagramType: 'packet', text: string): Promise<Packet
|
||||
export async function parse(diagramType: 'pie', text: string): Promise<Pie>;
|
||||
export async function parse(diagramType: 'architecture', text: string): Promise<Architecture>;
|
||||
export async function parse(diagramType: 'gitGraph', text: string): Promise<GitGraph>;
|
||||
export async function parse(diagramType: 'radar', text: string): Promise<Radar>;
|
||||
|
||||
export async function parse<T extends DiagramAST>(
|
||||
diagramType: keyof typeof initializers,
|
||||
|
19
packages/parser/tests/packet.test.ts
Normal file
19
packages/parser/tests/packet.test.ts
Normal file
@@ -0,0 +1,19 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import { Packet } from '../src/language/index.js';
|
||||
import { expectNoErrorsOrAlternatives, packetParse as parse } from './test-util.js';
|
||||
|
||||
describe('packet', () => {
|
||||
it.each([
|
||||
`packet-beta`,
|
||||
` packet-beta `,
|
||||
`\tpacket-beta\t`,
|
||||
`
|
||||
\tpacket-beta
|
||||
`,
|
||||
])('should handle regular packet', (context: string) => {
|
||||
const result = parse(context);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Packet);
|
||||
});
|
||||
});
|
343
packages/parser/tests/radar.test.ts
Normal file
343
packages/parser/tests/radar.test.ts
Normal file
@@ -0,0 +1,343 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import { Radar } from '../src/language/index.js';
|
||||
import { expectNoErrorsOrAlternatives, radarParse as parse } from './test-util.js';
|
||||
|
||||
const mutateGlobalSpacing = (context: string) => {
|
||||
return [
|
||||
context,
|
||||
` ${context} `,
|
||||
`\t${context}\t`,
|
||||
`
|
||||
\t${context}
|
||||
`,
|
||||
];
|
||||
};
|
||||
|
||||
describe('radar', () => {
|
||||
it.each([
|
||||
...mutateGlobalSpacing('radar-beta'),
|
||||
...mutateGlobalSpacing('radar-beta:'),
|
||||
...mutateGlobalSpacing('radar-beta :'),
|
||||
])('should handle regular radar', (context: string) => {
|
||||
const result = parse(context);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
});
|
||||
|
||||
describe('should handle title, accDescr, and accTitle', () => {
|
||||
it.each([
|
||||
...mutateGlobalSpacing(' title My Title'),
|
||||
...mutateGlobalSpacing('\n title My Title'),
|
||||
])('should handle title', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { title } = result.value;
|
||||
expect(title).toBe('My Title');
|
||||
});
|
||||
|
||||
it.each([
|
||||
...mutateGlobalSpacing(' accDescr: My Accessible Description'),
|
||||
...mutateGlobalSpacing('\n accDescr: My Accessible Description'),
|
||||
])('should handle accDescr', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { accDescr } = result.value;
|
||||
expect(accDescr).toBe('My Accessible Description');
|
||||
});
|
||||
|
||||
it.each([
|
||||
...mutateGlobalSpacing(' accTitle: My Accessible Title'),
|
||||
...mutateGlobalSpacing('\n accTitle: My Accessible Title'),
|
||||
])('should handle accTitle', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { accTitle } = result.value;
|
||||
expect(accTitle).toBe('My Accessible Title');
|
||||
});
|
||||
|
||||
it.each([
|
||||
...mutateGlobalSpacing(
|
||||
' title My Title\n accDescr: My Accessible Description\n accTitle: My Accessible Title'
|
||||
),
|
||||
...mutateGlobalSpacing(
|
||||
'\n title My Title\n accDescr: My Accessible Description\n accTitle: My Accessible Title'
|
||||
),
|
||||
])('should handle title + accDescr + accTitle', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { title, accDescr, accTitle } = result.value;
|
||||
expect(title).toBe('My Title');
|
||||
expect(accDescr).toBe('My Accessible Description');
|
||||
expect(accTitle).toBe('My Accessible Title');
|
||||
});
|
||||
});
|
||||
|
||||
describe('should handle axis', () => {
|
||||
it.each([`axis my-axis`, `axis my-axis["My Axis Label"]`])(
|
||||
'should handle one axis',
|
||||
(context: string) => {
|
||||
const result = parse(`radar-beta\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { axes } = result.value;
|
||||
expect(axes).toHaveLength(1);
|
||||
expect(axes[0].$type).toBe('Axis');
|
||||
expect(axes[0].name).toBe('my-axis');
|
||||
}
|
||||
);
|
||||
|
||||
it.each([
|
||||
`axis my-axis["My Axis Label"]
|
||||
axis my-axis2`,
|
||||
`axis my-axis, my-axis2`,
|
||||
`axis my-axis["My Axis Label"], my-axis2`,
|
||||
`axis my-axis, my-axis2["My Second Axis Label"]`,
|
||||
])('should handle multiple axes', (context: string) => {
|
||||
const result = parse(`radar-beta\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { axes } = result.value;
|
||||
expect(axes).toHaveLength(2);
|
||||
expect(axes.every((axis) => axis.$type === 'Axis')).toBe(true);
|
||||
expect(axes[0].name).toBe('my-axis');
|
||||
expect(axes[1].name).toBe('my-axis2');
|
||||
});
|
||||
|
||||
it.each([
|
||||
`axis my-axis["My Axis Label"]
|
||||
axis my-axis2["My Second Axis Label"]`,
|
||||
`axis my-axis ["My Axis Label"], my-axis2\t["My Second Axis Label"]`,
|
||||
])('should handle axis labels', (context: string) => {
|
||||
const result = parse(`radar-beta\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { axes } = result.value;
|
||||
expect(axes).toHaveLength(2);
|
||||
expect(axes[0].name).toBe('my-axis');
|
||||
expect(axes[0].label).toBe('My Axis Label');
|
||||
expect(axes[1].name).toBe('my-axis2');
|
||||
expect(axes[1].label).toBe('My Second Axis Label');
|
||||
});
|
||||
|
||||
it('should not allow empty axis names', () => {
|
||||
const result = parse(`radar-beta
|
||||
axis`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
|
||||
it('should not allow non-comma separated axis names', () => {
|
||||
const result = parse(`radar-beta
|
||||
axis my-axis my-axis2`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('should handle curves', () => {
|
||||
it.each([
|
||||
`radar-beta
|
||||
curve my-curve`,
|
||||
`radar-beta
|
||||
curve my-curve["My Curve Label"]`,
|
||||
])('should not allow curves without axes', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
|
||||
it.each([
|
||||
`radar-beta
|
||||
axis my-axis
|
||||
curve my-curve`,
|
||||
`radar-beta
|
||||
axis my-axis
|
||||
curve my-curve["My Curve Label"]`,
|
||||
])('should not allow curves without entries', (context: string) => {
|
||||
const result = parse(`radar-beta${context}`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
|
||||
it.each([
|
||||
`curve my-curve { 1 }`,
|
||||
`curve my-curve {
|
||||
1
|
||||
}`,
|
||||
`curve my-curve {
|
||||
|
||||
1
|
||||
|
||||
}`,
|
||||
])('should handle one curve with one entry', (context: string) => {
|
||||
const result = parse(`radar-beta\naxis my-axis\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { curves } = result.value;
|
||||
expect(curves).toHaveLength(1);
|
||||
expect(curves[0].$type).toBe('Curve');
|
||||
expect(curves[0].name).toBe('my-curve');
|
||||
expect(curves[0].entries).toHaveLength(1);
|
||||
expect(curves[0].entries[0].$type).toBe('Entry');
|
||||
expect(curves[0].entries[0].value).toBe(1);
|
||||
});
|
||||
|
||||
it.each([
|
||||
`curve my-curve { my-axis 1 }`,
|
||||
`curve my-curve { my-axis : 1 }`,
|
||||
`curve my-curve {
|
||||
my-axis: 1
|
||||
}`,
|
||||
])('should handle one curve with one detailed entry', (context: string) => {
|
||||
const result = parse(`radar-beta\naxis my-axis\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { curves } = result.value;
|
||||
expect(curves).toHaveLength(1);
|
||||
expect(curves[0].$type).toBe('Curve');
|
||||
expect(curves[0].name).toBe('my-curve');
|
||||
expect(curves[0].entries).toHaveLength(1);
|
||||
expect(curves[0].entries[0].$type).toBe('Entry');
|
||||
expect(curves[0].entries[0].value).toBe(1);
|
||||
expect(curves[0].entries[0]?.axis?.$refText).toBe('my-axis');
|
||||
});
|
||||
|
||||
it.each([
|
||||
`curve my-curve { ax1 1, ax2 2 }`,
|
||||
`curve my-curve {
|
||||
ax1 1,
|
||||
ax2 2
|
||||
}`,
|
||||
`curve my-curve["My Curve Label"] {
|
||||
ax1: 1, ax2: 2
|
||||
}`,
|
||||
])('should handle one curve with multiple detailed entries', (context: string) => {
|
||||
const result = parse(`radar-beta\naxis ax1, ax1\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { curves } = result.value;
|
||||
expect(curves).toHaveLength(1);
|
||||
expect(curves[0].$type).toBe('Curve');
|
||||
expect(curves[0].name).toBe('my-curve');
|
||||
expect(curves[0].entries).toHaveLength(2);
|
||||
expect(curves[0].entries[0].$type).toBe('Entry');
|
||||
expect(curves[0].entries[0].value).toBe(1);
|
||||
expect(curves[0].entries[0]?.axis?.$refText).toBe('ax1');
|
||||
expect(curves[0].entries[1].$type).toBe('Entry');
|
||||
expect(curves[0].entries[1].value).toBe(2);
|
||||
expect(curves[0].entries[1]?.axis?.$refText).toBe('ax2');
|
||||
});
|
||||
|
||||
it.each([
|
||||
`curve c1 { ax1 1, ax2 2 }
|
||||
curve c2 { ax1 3, ax2 4 }`,
|
||||
`curve c1 {
|
||||
ax1 1,
|
||||
ax2 2
|
||||
}
|
||||
curve c2 {
|
||||
ax1 3,
|
||||
ax2 4
|
||||
}`,
|
||||
`curve c1{ 1, 2 }, c2{ 3, 4 }`,
|
||||
])('should handle multiple curves', (context: string) => {
|
||||
const result = parse(`radar-beta\naxis ax1, ax1\n${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { curves } = result.value;
|
||||
expect(curves).toHaveLength(2);
|
||||
expect(curves.every((curve) => curve.$type === 'Curve')).toBe(true);
|
||||
expect(curves[0].name).toBe('c1');
|
||||
expect(curves[1].name).toBe('c2');
|
||||
});
|
||||
|
||||
it('should not allow empty curve names', () => {
|
||||
const result = parse(`radar-beta
|
||||
axis my-axis
|
||||
curve`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
|
||||
it('should not allow number and detailed entries in the same curve', () => {
|
||||
const result = parse(`radar-beta
|
||||
axis ax1, ax2
|
||||
curve my-curve { 1, ax1 2 }`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
|
||||
it('should not allow non-comma separated entries', () => {
|
||||
const result = parse(`radar-beta
|
||||
axis ax1, ax2
|
||||
curve my-curve { ax1 1 ax2 2 }`);
|
||||
expect(result.parserErrors).not.toHaveLength(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('should handle options', () => {
|
||||
it.each([`ticks 5`, `min 50`, `max 50`])(
|
||||
`should handle number option %s`,
|
||||
(context: string) => {
|
||||
const result = parse(`radar-beta
|
||||
axis ax1, ax2
|
||||
curve c1 { ax1 1, ax2 2 }
|
||||
${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { options } = result.value;
|
||||
expect(options).toBeDefined();
|
||||
const option = options.find((option) => option.name === context.split(' ')[0]);
|
||||
expect(option).toBeDefined();
|
||||
expect(option?.value).toBe(Number(context.split(' ')[1]));
|
||||
}
|
||||
);
|
||||
|
||||
it.each([`graticule circle`, `graticule polygon`])(
|
||||
`should handle string option %s`,
|
||||
(context: string) => {
|
||||
const result = parse(`radar-beta
|
||||
axis ax1, ax2
|
||||
curve c1 { ax1 1, ax2 2 }
|
||||
${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { options } = result.value;
|
||||
expect(options).toBeDefined();
|
||||
const option = options.find((option) => option.name === context.split(' ')[0]);
|
||||
expect(option).toBeDefined();
|
||||
expect(option?.value).toBe(context.split(' ')[1]);
|
||||
}
|
||||
);
|
||||
|
||||
it.each([`showLegend true`, `showLegend false`])(
|
||||
`should handle boolean option %s`,
|
||||
(context: string) => {
|
||||
const result = parse(`radar-beta
|
||||
axis ax1, ax2
|
||||
curve c1 { ax1 1, ax2 2 }
|
||||
${context}`);
|
||||
expectNoErrorsOrAlternatives(result);
|
||||
expect(result.value.$type).toBe(Radar);
|
||||
|
||||
const { options } = result.value;
|
||||
expect(options).toBeDefined();
|
||||
const option = options.find((option) => option.name === context.split(' ')[0]);
|
||||
expect(option).toBeDefined();
|
||||
expect(option?.value).toBe(context.split(' ')[1] === 'true');
|
||||
}
|
||||
);
|
||||
});
|
||||
});
|
@@ -5,12 +5,18 @@ import type {
|
||||
InfoServices,
|
||||
Pie,
|
||||
PieServices,
|
||||
Radar,
|
||||
RadarServices,
|
||||
Packet,
|
||||
PacketServices,
|
||||
GitGraph,
|
||||
GitGraphServices,
|
||||
} from '../src/language/index.js';
|
||||
import {
|
||||
createInfoServices,
|
||||
createPieServices,
|
||||
createRadarServices,
|
||||
createPacketServices,
|
||||
createGitGraphServices,
|
||||
} from '../src/language/index.js';
|
||||
|
||||
@@ -52,6 +58,28 @@ export function createPieTestServices() {
|
||||
}
|
||||
export const pieParse = createPieTestServices().parse;
|
||||
|
||||
const packetServices: PacketServices = createPacketServices().Packet;
|
||||
const packetParser: LangiumParser = packetServices.parser.LangiumParser;
|
||||
export function createPacketTestServices() {
|
||||
const parse = (input: string) => {
|
||||
return packetParser.parse<Packet>(input);
|
||||
};
|
||||
|
||||
return { services: packetServices, parse };
|
||||
}
|
||||
export const packetParse = createPacketTestServices().parse;
|
||||
|
||||
const radarServices: RadarServices = createRadarServices().Radar;
|
||||
const radarParser: LangiumParser = radarServices.parser.LangiumParser;
|
||||
export function createRadarTestServices() {
|
||||
const parse = (input: string) => {
|
||||
return radarParser.parse<Radar>(input);
|
||||
};
|
||||
|
||||
return { services: radarServices, parse };
|
||||
}
|
||||
export const radarParse = createRadarTestServices().parse;
|
||||
|
||||
const gitGraphServices: GitGraphServices = createGitGraphServices().GitGraph;
|
||||
const gitGraphParser: LangiumParser = gitGraphServices.parser.LangiumParser;
|
||||
export function createGitGraphTestServices() {
|
||||
|
Reference in New Issue
Block a user