mermaid/docs/Setup.md

204 lines
6.3 KiB
Markdown
Raw Normal View History

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
2019-07-12 20:40:54 +02:00
## mermaidAPI
2019-07-12 20:40:54 +02:00
2019-08-28 21:55:35 +02:00
This is the api to be used when optionally handling the integration with the web page, instead of using the default integration provided by mermaid.js.
2019-07-12 20:40:54 +02:00
The core of this api is the [**render**][1] function which, given a graph
definition as text, renders the graph/diagram and returns an svg element for the graph.
2019-08-28 21:50:44 +02:00
2019-08-28 21:55:35 +02:00
It is is then up to the user of the API to make use of the svg, either insert it somewhere in the page or do something completely different.
2019-08-28 21:56:27 +02:00
In addition to the render function, a number of behavioral configuration options are available.
2019-07-12 20:40:54 +02:00
## setSiteConfig
## setSiteConfig
| Function | Description | Type | Values |
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
2020-07-02 16:59:09 +02:00
**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\*\*
2020-07-02 16:59:09 +02:00
### Parameters
- `conf` the base currentConfig to use as siteConfig
Returns **any** the siteConfig
2020-07-02 16:59:09 +02:00
## getSiteConfig
## getSiteConfig
2020-04-11 18:02:05 +02:00
| Function | Description | Type | Values |
| ------------- | ------------------------------------------------- | ----------- | --------------------------------- |
| setSiteConfig | Returns the current siteConfig base configuration | Get Request | Returns Any Values in siteConfig |
2020-04-11 18:02:05 +02:00
**Notes**:
Returns **any** values in siteConfig.
2020-04-11 18:02:05 +02:00
Returns **any**
2020-07-02 16:59:09 +02:00
## setConfig
2020-04-11 18:02:05 +02:00
## setConfig
2020-04-11 18:02:05 +02:00
| Function | Description | Type | Values |
| ------------- | ------------------------------------- | ----------- | --------------------------------------- |
| setSiteConfig | Sets the siteConfig to desired values | Put Request | Any Values, except ones in secure array |
2020-07-02 16:59:09 +02:00
**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.
2020-04-11 18:02:05 +02:00
### Parameters
2020-04-11 18:02:05 +02:00
- `conf` the potential currentConfig
2020-07-02 16:59:09 +02:00
Returns **any** the currentConfig merged with the sanitized conf
2020-04-11 18:02:05 +02:00
## getConfig
2020-04-11 18:02:05 +02:00
## getConfig
2020-07-02 16:59:09 +02:00
| Function | Description | Type | Return Values |
| --------- | ------------------------- | ----------- | ----------------------------- |
| getConfig | Obtains the currentConfig | Get Request | Any Values from currentConfig |
2020-04-11 18:02:05 +02:00
**Notes**:
Returns **any** the currentConfig
2020-04-11 18:02:05 +02:00
Returns **any** the currentConfig
2020-07-02 16:59:09 +02:00
## sanitize
2020-04-11 18:02:05 +02:00
## sanitize
2020-04-11 18:02:05 +02:00
| Function | Description | Type | Values |
| -------- | -------------------------------------- | ----------- | ------ |
| sanitize | Sets the siteConfig to desired values. | Put Request | None |
2020-07-02 16:59:09 +02:00
Ensures options parameter does not attempt to override siteConfig secure keys
Note: modifies options in-place
2020-04-11 18:02:05 +02:00
### Parameters
2020-04-11 18:02:05 +02:00
- `options` the potential setConfig parameter
2020-07-02 16:59:09 +02:00
## reset
2020-04-11 18:02:05 +02:00
## reset
2020-04-11 18:02:05 +02:00
| Function | Description | Type | Required | Values |
| -------- | ---------------------------- | ----------- | -------- | ------ |
| reset | Resets currentConfig to conf | Put Request | Required | None |
2020-07-02 16:59:09 +02:00
| Parameter | Description | Type | Required | Values |
| --------- | ------------------------------------------------------------- | ---------- | -------- | -------------------------------------------- |
| conf | base set of values, which currentConfig coul be **reset** to. | Dictionary | Required | Any Values, with respect to the secure Array |
2020-04-11 18:02:05 +02:00
\*Notes :
(default: current siteConfig ) (optional, default `getSiteConfig()`)
### Parameters
- `conf` the base currentConfig to reset to (default: current siteConfig ) (optional, default `getSiteConfig()`)
2019-07-12 20:40:54 +02:00
## render
Function that renders an svg with a graph from a chart definition. Usage example below.
2019-07-12 20:40:54 +02:00
```js
2019-07-12 20:40:54 +02:00
mermaidAPI.initialize({
startOnLoad:true
});
$(function(){
const graphDefinition = 'graph TB\na-->b';
const cb = function(svgGraph){
console.log(svgGraph);
};
mermaidAPI.render('id1',graphDefinition,cb);
});
2019-07-12 20:40:54 +02:00
```
### Parameters
- `id` the id of the element to be rendered
2020-06-17 11:54:24 +02:00
- `_txt` the graph definition
- `cb` callback which is called after rendering is finished with the svg code as inparam.
- `container` selector to element in which a div with the graph temporarily will be inserted. In one is
provided a hidden div will be inserted in the body of the page instead. The element will be removed when rendering is
completed.
2019-08-28 21:50:44 +02:00
##
2019-08-28 21:57:10 +02:00
## mermaidAPI configuration defaults
```html
<script>
var config = {
theme:'default',
logLevel:'fatal',
securityLevel:'strict',
startOnLoad:true,
arrowMarkerAbsolute:false,
2020-07-11 12:50:36 +02:00
er:{
diagramPadding:20,
layoutDirection:'TB',
minEntityWidth:100,
minEntityHeight:75,
entityPadding:15,
stroke:'gray',
fill:'honeydew',
fontSize:12,
useMaxWidth:true,
},
flowchart:{
diagramPadding:8,
htmlLabels:true,
curve:'linear',
},
sequence:{
diagramMarginX:50,
diagramMarginY:10,
actorMargin:50,
width:150,
height:65,
boxMargin:10,
boxTextMargin:5,
noteMargin:10,
messageMargin:35,
2020-04-11 18:02:05 +02:00
messageAlign:'center',
mirrorActors:true,
bottomMarginAdj:1,
useMaxWidth:true,
rightAngles:false,
showSequenceNumbers:false,
},
gantt:{
titleTopMargin:25,
barHeight:20,
barGap:4,
topPadding:50,
leftPadding:75,
gridLineStartPadding:35,
fontSize:11,
fontFamily:'"Open-Sans", "sans-serif"',
numberSectionStyles:4,
axisFormat:'%Y-%m-%d',
}
};
mermaid.initialize(config);
</script>
```
2020-07-13 16:39:52 +02:00
[1]: Setup.md?id=render