FlowChart.Js PoC

by vijayweb

HTML

<script src="https://rawgit.com/DmitryBaranovskiy/raphael/master/raphael.min.js"></script>

        <script src="https://rawgit.com/adrai/flowchart.js/master/release/flowchart.js"></script>

        <script>
            window.onload = function () {
                var btn = document.getElementById("run"),
                    cd = document.getElementById("code"),
                    chart;
                (btn.onclick = function () {
                    var code = cd.value;
                    if (chart) {
                      chart.clean();
                    }
                    chart = flowchart.parse(code);
                    chart.drawSVG('canvas', {
                      // 'x': 30,
                      // 'y': 50,
                      'line-width': 2,
                      'line-length': 30,
                      'text-margin': 10,
                      'font-size': 12,
                      'font': 'normal',
                      'font-family': 'Arial',
                      'font-weight': 'normal',
                      'font-color': 'black',
                      'line-color': 'black',
                      'element-color': 'black',
                      'fill': 'white',
                      'yes-text': '',
                      'no-text': '',
                      'arrow-end': 'block',
                      'scale': 1,
                      'symbols': {
                        'start': {
                        },
                        'end':{
                          'class': 'end-element'
                        }
                      },
                      'flowstate' : {
                        'past' : { 'fill' : '#CCCCCC'},
                        'flow' : { 'color' : '#EEEEEE'},
                        'current' : {'fill' : 'yellow', 'font-color' : 'red', 'font-weight' : 'bold'},
                        'future' : { 'fill' : '#FFFF99'},
                        'request' : { 'fill' : 'blue'},
                        'invalid':...

CSS

.test {
  back-color: blue;
}