mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-01-28 07:03:17 +08:00
Update documentation
This commit is contained in:
parent
619b9f230f
commit
7f22d155f2
@ -450,13 +450,13 @@ It is possible to bind a click event to a node, the click can lead to either a j
|
|||||||
You would define these actions on a separate line after all classes have been declared.
|
You would define these actions on a separate line after all classes have been declared.
|
||||||
|
|
||||||
```
|
```
|
||||||
action className "reference" "tooltip"
|
click className call callback() "tooltip"
|
||||||
|
click className href "url" "tooltip"
|
||||||
```
|
```
|
||||||
|
|
||||||
- _action_ is either `link` or `callback`, depending on which type of interaction you want to have called
|
|
||||||
- _className_ is the id of the node that the action will be associated with
|
- _className_ is the id of the node that the action will be associated with
|
||||||
- _reference_ is either the url link, or the function name for callback. (note: callback function will be called with the nodeId as parameter).
|
|
||||||
- (_optional_) tooltip is a string to be displayed when hovering over element (note: The styles of the tooltip are set by the class .mermaidTooltip.)
|
- (_optional_) tooltip is a string to be displayed when hovering over element (note: The styles of the tooltip are set by the class .mermaidTooltip.)
|
||||||
|
- note: callback function will be called with the nodeId as parameter.
|
||||||
|
|
||||||
### Examples
|
### Examples
|
||||||
|
|
||||||
@ -465,7 +465,7 @@ _URL Link:_
|
|||||||
```
|
```
|
||||||
classDiagram
|
classDiagram
|
||||||
class Shape
|
class Shape
|
||||||
link Shape "http://www.github.com" "This is a tooltip for a link"
|
click Shape href "http://www.github.com" "This is a tooltip for a link"
|
||||||
```
|
```
|
||||||
|
|
||||||
_Callback:_
|
_Callback:_
|
||||||
@ -473,7 +473,7 @@ _Callback:_
|
|||||||
```
|
```
|
||||||
classDiagram
|
classDiagram
|
||||||
class Shape
|
class Shape
|
||||||
callback Shape "callbackFunction" "This is a tooltip for a callback"
|
click Shape call callbackFunction() "This is a tooltip for a callback"
|
||||||
```
|
```
|
||||||
|
|
||||||
```
|
```
|
||||||
@ -488,8 +488,8 @@ callback Shape "callbackFunction" "This is a tooltip for a callback"
|
|||||||
classDiagram
|
classDiagram
|
||||||
class Class01
|
class Class01
|
||||||
class Class02
|
class Class02
|
||||||
callback Class01 "callbackFunction" "Callback tooltip"
|
click Class01 call callbackFunction() "Callback tooltip"
|
||||||
link Class02 "http://www.github.com" "This is a link"
|
click Class02 href "http://www.github.com" "This is a link"
|
||||||
```
|
```
|
||||||
|
|
||||||
> **Success** The tooltip functionality and the ability to link to urls are available from version 0.5.2.
|
> **Success** The tooltip functionality and the ability to link to urls are available from version 0.5.2.
|
||||||
@ -521,8 +521,8 @@ Beginners tip, a full example using interactive links in an html context:
|
|||||||
+run()
|
+run()
|
||||||
}
|
}
|
||||||
|
|
||||||
callback Duck callback "Tooltip"
|
click Duck call callback() "Tooltip"
|
||||||
click Zebra "http://www.github.com" "This is a link"
|
click Zebra href "http://www.github.com" "This is a link"
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user