| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116 | <!doctype html><html><head>    <meta charset="utf-8">    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    <title>jsMind</title>    <link type="text/css" rel="stylesheet" href="../style/jsmind.css" />    <style type="text/css">        html,        body {            margin: 0;            border: 0;            padding: 0;            width: 100%;            height: 100%;            overflow: hidden;        }        #jsmind_container {            width: 100%;            height: 100%;            overflow: auto;            /*background:#f4f4f4;*/            background: #f4f4f4;        }    </style></head><body>    <!-- <input type="file" onchange="load_file(this);" />    <button onclick="save_nodetree();">nodetree</button>    <button onclick="replay();">replay</button> -->    <div id="jsmind_container"></div>    <script type="text/javascript" src="../js/jsmind.js"></script>    <script type="text/javascript" src="../js/jsmind.draggable.js"></script>    <script type="text/javascript" src="../features/jsmind.shell.js"></script>    <script type="text/javascript" src="js/jsmind.draggable.js"></script>    <script type="text/javascript">        var _jm = null;        function load_jsmind() {            var mind = {                meta: {                    name: 'demo',                    author: '745902130@qq.com',                    version: '0.2'                },                format: 'node_array',                data: [                    { "id": "root", "isroot": true, "topic": "cocorobopbl" },                    { "id": "sub1", "parentid": "root", "topic": "cocorobopbl" },                    { "id": "sub11", "parentid": "sub1", "topic": "cocorobopbl" },                    { "id": "sub12", "parentid": "sub1", "topic": "cocorobopbl" },                    { "id": "sub13", "parentid": "sub1", "topic": "cocorobopbl" },                    { "id": "sub2", "parentid": "root", "topic": "cocorobopbl" },                    { "id": "sub21", "parentid": "sub2", "topic": "cocorobopbl" },                    { "id": "sub22", "parentid": "sub2", "topic": "cocorobopbl" },                    { "id": "sub3", "parentid": "root", "topic": "cocorobopbl" },                ]            };            var options = {                container: 'jsmind_container',                editable: true,                theme: 'primary',                shortcut: {                    handles: {                        test: function (j, e) {                            console.log(j);                        }                    },                    mapping: {                        test: 89                    }                }            }            _jm = jsMind.show(options, mind);            // jm.set_readonly(true);            // var mind_data = jm.get_data();            // alert(mind_data);        }        function load_file(fi) {            var files = fi.files;            if (files.length > 0) {                var file_data = files[0];                jsMind.util.file.read(file_data, function (freemind_data, jsmind_name) {                    var mind = jsmind_data;                    if (!!mind) {                        _jm.show(mind);                    } else {                        console.error('can not open this file as mindmap');                    }                });            }        }        function save_nodetree() {            var mind_data = _jm.get_data('node_tree');            console.log(mind_data);        }        function replay() {            var shell = _jm.shell;            if (!!shell) {                shell.replay();            }        }        load_jsmind();    </script></body></html>
 |