Skip to content

bubkoo/hexo-filter-flowchart

Folders and files

NameName
Last commit message
Last commit date

Latest commit

62e7e7d · Jun 11, 2019

History

24 Commits
May 3, 2017
Jan 9, 2017
Jan 9, 2017
Jan 9, 2017
Jan 9, 2017
Apr 25, 2017
May 1, 2019
May 3, 2017
Jan 13, 2017

Repository files navigation

hexo-filter-flowchart

MIT License

npm: Package Quality

Generate flowchart diagrams for Hexo.

Install

npm install --save hexo-filter-flowchart

Usage

This plugin is based on flowchart.js, so you can defined the chart as follow:

```flow
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
```

snapshot.svg

Config

In your site's _config.yml:

flowchart:
  # raphael:   # optional, the source url of raphael.js
  # flowchart: # optional, the source url of flowchart.js
  options: # options used for `drawSVG`

Your config will be merged into default config:

{
  "raphael": "https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.min.js",
  "flowchart": "https://cdnjs.cloudflare.com/ajax/libs/flowchart/1.6.5/flowchart.min.js",
  "options": {
    "scale": 1,
    "line-width": 2,
    "line-length": 50,
    "text-margin": 10,
    "font-size": 12
  }
}

Related

Contributing

Pull requests and stars are highly welcome.

For bugs and feature requests, please create an issue.