diff options
Diffstat (limited to 'exampleSite')
| -rw-r--r-- | exampleSite/config.toml | 4 | ||||
| -rw-r--r-- | exampleSite/content/post/js-flowchart-diagrams.md | 131 |
2 files changed, 135 insertions, 0 deletions
diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 6376691..4e72e0a 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -101,6 +101,10 @@ copyright = "" # default: author.name ↓ # 默认为下面配 clientId = "" # Your client ID clientSecret = "" # Your client secret + [params.flowchartDiagrams]# see https://blog.olowolo.com/example-site/post/js-sequence-diagrams/ + enable = false + options = "" + [params.busuanzi] # count web traffic by busuanzi # 是否使用不蒜子统计站点访问量 enable = false siteUV = true diff --git a/exampleSite/content/post/js-flowchart-diagrams.md b/exampleSite/content/post/js-flowchart-diagrams.md new file mode 100644 index 0000000..2111c52 --- /dev/null +++ b/exampleSite/content/post/js-flowchart-diagrams.md @@ -0,0 +1,131 @@ +--- +title: "JS Flowchart Diagrams" +date: 2015-03-04T21:57:50+08:00 +draft: false + +flowchartDiagrams: + enable: true + options: "{ + 'x': 0, + 'y': 0, + 'line-width': 3, + 'line-length': 50, + 'text-margin': 10, + 'font-size': 14, + 'font-color': 'black', + 'line-color': 'black', + 'element-color': 'black', + 'fill': 'white', + 'yes-text': 'yes', + 'no-text': 'no', + 'arrow-end': 'block', + 'scale': 1, + 'i-am-a-comment-1': 'Do not use //!', + 'i-am-a-comment-2': 'style symbol types', + 'symbols': { + 'start': { + 'font-color': 'red', + 'element-color': 'green', + 'fill': 'yellow' + }, + 'end': { + 'class': 'end-element' + } + }, + 'i-am-a-comment-3': 'even flowstate support ;-)', + 'flowstate': { + 'request': {'fill': 'blue'} + } + }" +--- + +## Usage + +```flowchart +st=>start: Start|past:>http://www.google.com[blank] +e=>end: End:>http://www.google.com +op1=>operation: My Operation|past +op2=>operation: Stuff|current +sub1=>subroutine: My Subroutine|invalid +cond=>condition: Yes +or No?|approved:>http://www.google.com +c2=>condition: Good idea|rejected +io=>inputoutput: catch something...|request + +st->op1(right)->cond +cond(yes, right)->c2 +cond(no)->sub1(left)->op1 +c2(yes)->io->e +c2(no)->op2->e +``` + +<!--more--> + + ```flowchart + st=>start: Start|past:>http://www.google.com[blank] + e=>end: End:>http://www.google.com + op1=>operation: My Operation|past + op2=>operation: Stuff|current + sub1=>subroutine: My Subroutine|invalid + cond=>condition: Yes + or No?|approved:>http://www.google.com + c2=>condition: Good idea|rejected + io=>inputoutput: catch something...|request + + st->op1(right)->cond + cond(yes, right)->c2 + cond(no)->sub1(left)->op1 + c2(yes)->io->e + c2(no)->op2->e + ``` + +## Configuration + +Configure for all home and regular pages: + +```toml +[params.flowchartDiagrams] + enable = true + options = "" +``` + +Configure for a single post in the front matter (**Params in front matter have higher precedence**): + +```yml +flowchartDiagrams: + enable: true + options: "{ + 'x': 0, + 'y': 0, + 'line-width': 3, + 'line-length': 50, + 'text-margin': 10, + 'font-size': 14, + 'font-color': 'black', + 'line-color': 'black', + 'element-color': 'black', + 'fill': 'white', + 'yes-text': 'yes', + 'no-text': 'no', + 'arrow-end': 'block', + 'scale': 1, + 'i-am-a-comment-1': 'Do not use //!', + 'i-am-a-comment-2': 'style symbol types', + 'symbols': { + 'start': { + 'font-color': 'red', + 'element-color': 'green', + 'fill': 'yellow' + }, + 'end': { + 'class': 'end-element' + } + }, + 'i-am-a-comment-3': 'even flowstate support ;-)', + 'flowstate': { + 'request': {'fill': 'blue'} + } + }" +``` + +See more information from https://github.com/adrai/flowchart.js. |