All Projects → bubkoo → Hexo Filter Flowchart

bubkoo / Hexo Filter Flowchart

Licence: mit
Generate flowchart diagrams for Hexo.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

Projects that are alternatives of or similar to Hexo Filter Flowchart

Flutter graphite
Flutter widget to draw interactive direct graphs (flowcharts) of any complexity in a tile rectangular manner.
Stars: ✭ 23 (-80.99%)
Mutual labels:  flowchart
Laravel Smartmd
🎯 A simple markdown editor compatible most markdown parse,You can choose any parse methods on server or client,like Mathematical formula、flowchart、upload image...
Stars: ✭ 76 (-37.19%)
Mutual labels:  flowchart
Flowmaker
flowmaker: JS to SVG flowchart generation extension for Vscode in realtime written in typescript and also download the SVG through local node server. Extension:
Stars: ✭ 108 (-10.74%)
Mutual labels:  flowchart
Logicflow
A front-end framework for process visualization.
Stars: ✭ 973 (+704.13%)
Mutual labels:  flowchart
Flowy
The minimal javascript library to create flowcharts ✨
Stars: ✭ 8,636 (+7037.19%)
Mutual labels:  flowchart
Vzl
💠 DOT Language Live Editor (GraphViz)
Stars: ✭ 83 (-31.4%)
Mutual labels:  flowchart
X Flowchart Vue
基于G6和Vue的可视化图形编辑器。A visual graph editor based on G6 and Vue.
Stars: ✭ 751 (+520.66%)
Mutual labels:  flowchart
Nomnoml
The sassy UML diagram renderer
Stars: ✭ 1,685 (+1292.56%)
Mutual labels:  flowchart
Flowchart Editor
基于G6和VUE的可视化流程编辑工具
Stars: ✭ 60 (-50.41%)
Mutual labels:  flowchart
Flowy Vue
Vue Flowy makes creating flowchart or hierarchy chart functionality an easy task. Build automation software, mind mapping tools, organisation charts, or simple programming platforms in minutes by implementing the library into your project.
Stars: ✭ 107 (-11.57%)
Mutual labels:  flowchart
Devflowcharter
Flowchart builder and code generator.
Stars: ✭ 41 (-66.12%)
Mutual labels:  flowchart
React Flow Chart
A flexible, stateless, declarative flow chart library for react.
Stars: ✭ 1,051 (+768.6%)
Mutual labels:  flowchart
Markdown Online Editor
📝基于 Vue、Vditor,所构建的在线 Markdown 编辑器,支持流程图、甘特图、时序图、任务列表、HTML 自动转换为 Markdown 等功能;🎉新增「所见即所得」编辑模式。
Stars: ✭ 1,373 (+1034.71%)
Mutual labels:  flowchart
Flowchart.js
Draws simple SVG flow chart diagrams from textual representation of the diagram
Stars: ✭ 7,711 (+6272.73%)
Mutual labels:  flowchart
Butterfly
🦋Butterfly,A JavaScript/React/Vue2 Diagramming library which concentrate on flow layout field. (基于JavaScript/React/Vue2的流程图组件)
Stars: ✭ 2,343 (+1836.36%)
Mutual labels:  flowchart
Jsplumb
Visual connectivity for webapps
Stars: ✭ 6,758 (+5485.12%)
Mutual labels:  flowchart
Hook Flow
A flowchart that explains the new lifecycle of a Hooks component. https://dwe.st/hf
Stars: ✭ 1,246 (+929.75%)
Mutual labels:  flowchart
Jsplumb Example
Draw a flow chart with vue and jsplumb
Stars: ✭ 121 (+0%)
Mutual labels:  flowchart
X6
🚀 JavaScript diagramming library that uses SVG and HTML for rendering.
Stars: ✭ 2,686 (+2119.83%)
Mutual labels:  flowchart
Flowpoints.js
A developer-friendly library for creating flowcharts and diagrams.
Stars: ✭ 103 (-14.88%)
Mutual labels:  flowchart

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.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].