mirror of
				https://github.com/mermaid-js/mermaid.git
				synced 2025-11-04 04:44:08 +01:00 
			
		
		
		
	Updated API
This commit is contained in:
		@@ -263,84 +263,14 @@ The number of alternating section styles.
 | 
			
		||||
Datetime format of the axis. This might need adjustment to match your locale and preferences
 | 
			
		||||
**Default value '%Y-%m-%d'**.
 | 
			
		||||
 | 
			
		||||
## journey
 | 
			
		||||
 | 
			
		||||
The object containing configurations specific for sequence diagrams
 | 
			
		||||
 | 
			
		||||
### diagramMarginX
 | 
			
		||||
 | 
			
		||||
margin to the right and left of the sequence diagram.
 | 
			
		||||
**Default value 50**.
 | 
			
		||||
 | 
			
		||||
### diagramMarginY
 | 
			
		||||
 | 
			
		||||
margin to the over and under the sequence diagram.
 | 
			
		||||
**Default value 10**.
 | 
			
		||||
 | 
			
		||||
### actorMargin
 | 
			
		||||
 | 
			
		||||
Margin between actors.
 | 
			
		||||
**Default value 50**.
 | 
			
		||||
 | 
			
		||||
### width
 | 
			
		||||
 | 
			
		||||
Width of actor boxes
 | 
			
		||||
**Default value 150**.
 | 
			
		||||
 | 
			
		||||
### height
 | 
			
		||||
 | 
			
		||||
Height of actor boxes
 | 
			
		||||
**Default value 65**.
 | 
			
		||||
 | 
			
		||||
### boxMargin
 | 
			
		||||
 | 
			
		||||
Margin around loop boxes
 | 
			
		||||
**Default value 10**.
 | 
			
		||||
 | 
			
		||||
### boxTextMargin
 | 
			
		||||
 | 
			
		||||
margin around the text in loop/alt/opt boxes
 | 
			
		||||
**Default value 5**.
 | 
			
		||||
 | 
			
		||||
### noteMargin
 | 
			
		||||
 | 
			
		||||
margin around notes.
 | 
			
		||||
**Default value 10**.
 | 
			
		||||
 | 
			
		||||
### messageMargin
 | 
			
		||||
 | 
			
		||||
Space between messages.
 | 
			
		||||
**Default value 35**.
 | 
			
		||||
 | 
			
		||||
### messageAlign
 | 
			
		||||
 | 
			
		||||
Multiline message alignment. Possible values are:
 | 
			
		||||
 | 
			
		||||
-   left
 | 
			
		||||
-   center **default**
 | 
			
		||||
-   right
 | 
			
		||||
 | 
			
		||||
### bottomMarginAdj
 | 
			
		||||
 | 
			
		||||
Depending on css styling this might need adjustment.
 | 
			
		||||
Prolongs the edge of the diagram downwards.
 | 
			
		||||
**Default value 1**.
 | 
			
		||||
 | 
			
		||||
### useMaxWidth
 | 
			
		||||
 | 
			
		||||
when this flag is set the height and width is set to 100% and is then scaling with the
 | 
			
		||||
available space if not the absolute space required is used.
 | 
			
		||||
**Default value true**.
 | 
			
		||||
 | 
			
		||||
### rightAngles
 | 
			
		||||
 | 
			
		||||
This will display arrows that start and begin at the same node as right angles, rather than a curve
 | 
			
		||||
**Default value false**.
 | 
			
		||||
 | 
			
		||||
## er
 | 
			
		||||
 | 
			
		||||
The object containing configurations specific for entity relationship diagrams
 | 
			
		||||
 | 
			
		||||
### diagramPadding
 | 
			
		||||
 | 
			
		||||
The amount of padding around the diagram as a whole so that embedded diagrams have margins, expressed in pixels
 | 
			
		||||
 | 
			
		||||
### layoutDirection
 | 
			
		||||
 | 
			
		||||
Directional bias for layout of entities. Can be either 'TB', 'BT', 'LR', or 'RL',
 | 
			
		||||
@@ -348,15 +278,15 @@ where T = top, B = bottom, L = left, and R = right.
 | 
			
		||||
 | 
			
		||||
### minEntityWidth
 | 
			
		||||
 | 
			
		||||
The mimimum width of an entity box
 | 
			
		||||
The mimimum width of an entity box, expressed in pixels
 | 
			
		||||
 | 
			
		||||
### minEntityHeight
 | 
			
		||||
 | 
			
		||||
The minimum height of an entity box
 | 
			
		||||
The minimum height of an entity box, expressed in pixels
 | 
			
		||||
 | 
			
		||||
### entityPadding
 | 
			
		||||
 | 
			
		||||
The minimum internal padding between the text in an entity box and the enclosing box borders
 | 
			
		||||
The minimum internal padding between the text in an entity box and the enclosing box borders, expressed in pixels
 | 
			
		||||
 | 
			
		||||
### stroke
 | 
			
		||||
 | 
			
		||||
@@ -366,12 +296,6 @@ Stroke color of box edges and lines
 | 
			
		||||
 | 
			
		||||
Fill color of entity boxes
 | 
			
		||||
 | 
			
		||||
### fillOpacity
 | 
			
		||||
 | 
			
		||||
Opacity of entity boxes - if you want to see how the crows feet
 | 
			
		||||
retain their elegant joins to the boxes regardless of the angle of incidence
 | 
			
		||||
then override this to something less than 100%
 | 
			
		||||
 | 
			
		||||
### fontSize
 | 
			
		||||
 | 
			
		||||
Font size
 | 
			
		||||
@@ -431,6 +355,7 @@ mermaidAPI.initialize({
 | 
			
		||||
      boxTextMargin:5,
 | 
			
		||||
      noteMargin:10,
 | 
			
		||||
      messageMargin:35,
 | 
			
		||||
      messageAlign:'center',
 | 
			
		||||
      mirrorActors:true,
 | 
			
		||||
      bottomMarginAdj:1,
 | 
			
		||||
      useMaxWidth:true,
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										23
									
								
								docs/user-journey.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										23
									
								
								docs/user-journey.md
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,23 @@
 | 
			
		||||
# User Journey Diagram
 | 
			
		||||
 | 
			
		||||
> User journeys describe at a high level of detail exactly what steps different users take to complete a specific task within a system, application or website. This technique shows the current (as-is) user workflow, and reveals areas of improvement for the to-be workflow. (Wikipedia)
 | 
			
		||||
 | 
			
		||||
Mermaid can render user journey diagrams:
 | 
			
		||||
 | 
			
		||||
```markdown
 | 
			
		||||
journey
 | 
			
		||||
    title My working day
 | 
			
		||||
    section Go to work
 | 
			
		||||
      Make tea: 5: Me
 | 
			
		||||
      Go upstairs: 3: Me
 | 
			
		||||
      Do work: 1: Me, Cat
 | 
			
		||||
    section Go home
 | 
			
		||||
      Go downstairs: 5: Me
 | 
			
		||||
      Sit down: 5: Me
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
Each user journey is split into sections, these describe the part of the task
 | 
			
		||||
the user is trying to complete.
 | 
			
		||||
 | 
			
		||||
Tasks syntax is `Task name: <score>: <comma separated list of actors>`
 | 
			
		||||
 | 
			
		||||
		Reference in New Issue
	
	Block a user