jsmind.js 思维导图js插件-BFW插件库

jsmind.js 思维导图js插件
第一步导入bfwone
第二步执行思维导图插件代码
示例如下
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["jsmind", "jsmind"], function() {
                function load_jsmind() {
                    var mind = {
                        "meta": {
                            "name": "demo",
                            "author": "hizzgdev@163.com",
                            "version": "0.2",
                        },
                        "format": "node_array",
                        "data": [{
                            "id": "root", "isroot": true, "topic": "jsMind"
                        },

                            {
                                "id": "sub1", "parentid": "root", "topic": "sub1", "background-color": "#0000ff"
                            },
                            {
                                "id": "sub11", "parentid": "sub1", "topic": "sub11"
                            },
                            {
                                "id": "sub12", "parentid": "sub1", "topic": "sub12"
                            },
                            {
                                "id": "sub13", "parentid": "sub1", "topic": "sub13"
                            },

                            {
                                "id": "sub2", "parentid": "root", "topic": "sub2"
                            },
                            {
                                "id": "sub21", "parentid": "sub2", "topic": "sub21"
                            },
                            {
                                "id": "sub22", "parentid": "sub2", "topic": "sub22", "foreground-color": "#33ff33"
                            },

                            {
                                "id": "sub3", "parentid": "root", "topic": "sub3"
                            },
                        ]
                    };
                    var options = {
                        container: 'jsmind_container',
                        editable: true,
                        theme: 'primary'
                    }
                    var jm = jsMind.show(options, mind);
                    // jm.set_readonly(true);
                    // var mind_data = jm.get_data();
                    // alert(mind_data);
                    jm.add_node("sub2", "sub23", "new node", {
                        "background-color": "red"
                    });
                    jm.set_node_color('sub21', 'green', '#ccc');
                }

                load_jsmind();
            });
        });
    </script>
    <style type="text/css">
        #jsmind_container {
            width: 800px;
            height: 500px;
            border: solid 1px #ccc;
            /*background:#f4f4f4;*/
            background: #f4f4f4;
        }
    </style>
</head>
<body>
    <div id="jsmind_container"></div>
</body>
</html>
jsmind.js 思维导图js插件

网友评论0

ace.js

xheditor.js

jsmind.js

sketchpad.js

prism.js

highlight.js

tinymce.js

gantt.js

tui-image-editor.js

drawingboard.js
