<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    TWaver - 專注UI技術(shù)

    http://twaver.servasoft.com/
    posts - 171, comments - 191, trackbacks - 0, articles - 2
      BlogJava :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理

    在TWaver的Tree節(jié)點上畫線

    Posted on 2015-01-13 10:17 TWaver 閱讀(3098) 評論(0)  編輯  收藏

    論壇上有同學(xué)提出如何在tree上畫引導(dǎo)線,之前我們Flex已經(jīng)實現(xiàn)此功能,現(xiàn)在最新版的HTML5也將添加此功能。先看看效果:
    treeLine
    treeTableLine
    詳細的使用方法可以參考我們開發(fā)手冊中可視化視圖組件#Tree引導(dǎo)線一章,下面貼出一個Demo,沒有圖標,沒有框選。僅供參考:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    TreeLineDemo<script src="../twaver.js"></script>
    <script>
    <![CDATA[
        var box = new twaver.ElementBox();
        var tree = new twaver.controls.Tree(box);
     
        function init() {
            initTreeView();
            initDataBox();
        }
     
        function initTreeView() {
            var treeDom = tree.getView();
            treeDom.style.width = "100%";
            treeDom.style.height = "100%";
            document.body.appendChild(treeDom);
     
            tree.setLineType('solid');//solid,dotted,none
            tree.setLineColor('#000000');
            tree.setLineAlpha(1);
            tree.setLineThickness(2);
        }
     
        function initDataBox() {
            var group = new twaver.Group();
            group.setName('Group');
            group.setIcon(null);
            box.add(group);
     
            for (var i = 0; i < 2; i++) {
                var node1 = new twaver.Node({
                    name:'Node-'+i,
                    location:{
                        x:100,
                        y:200
                    },
                });
                node1.setIcon(null);
                node1.setParent(group);
                box.add(node1);
                for(var j=0;j<2;j++){
                    var node2 = new twaver.Node();
                    node2.setName('Node-'+i+'-'+j);
                    node2.setParent(node1);
                    node2.setIcon(null);
                    box.add(node2);
     
                    for(var k=0;k<2;k++){
                        var node3 = new twaver.Node();
                        node3.setName('Node-'+i + '-' + j+'-'+k);
                    node3.setParent(node2);
                    node3.setIcon(null);
                    box.add(node3);
                    for(var m=0;m<4;m++){
                        var node4 = new twaver.Node();
                        node4.setName('Node-'+i+'-'+j+'-'+'-'+k+'-'+m);
                    node4.setParent(node3);
                    node4.setIcon(null);
                    box.add(node4);
                }
                var node = new twaver.Node({
                    name:'Node-'+(i+1) + '-' + (j+1)+'-'+(k+1)
                });
                node.setIcon(null);
                box.add(node);
                node.setParent(node2);
            }
            var node = new twaver.Node({
                    name:'Node-'+(i+1)+'-'+(j+1)
                });
            node.setIcon(null);
            box.add(node);
            node.setParent(node1);
        }
        var node = new twaver.Node({
            name:'Node-'+(i+1)
        });
        node.setIcon(null);
        box.add(node);
        node.setParent(group);
        }
        tree.expandAll();
    }
    ]]></script>

    treeLine
    如有需要可郵箱聯(lián)系:jeff.fu@servasoft.com


    只有注冊用戶登錄后才能發(fā)表評論。


    網(wǎng)站導(dǎo)航:
     
    主站蜘蛛池模板: 亚洲美女视频网站| 亚州**色毛片免费观看| 久久久久久噜噜精品免费直播 | 中文字幕免费在线视频| 性盈盈影院免费视频观看在线一区| 亚洲成色在线综合网站| 黄色a三级三级三级免费看| 亚洲精品无码永久在线观看 | 成人特黄a级毛片免费视频| 亚洲国产精品成人精品无码区在线| 亚洲色偷偷综合亚洲av78| 久久久久久毛片免费播放| 亚洲综合在线另类色区奇米| 亚洲sm另类一区二区三区| 精品久久久久成人码免费动漫| 亚洲AV无码欧洲AV无码网站| 日韩免费码中文在线观看| 真实乱视频国产免费观看| 亚洲国产精品线观看不卡| 久9热免费精品视频在线观看| 亚洲日本在线观看视频| AV激情亚洲男人的天堂国语| 无码人妻一区二区三区免费手机 | 亚洲第一香蕉视频| 免费播放在线日本感人片| 亚洲日韩国产一区二区三区| 色综合久久精品亚洲国产| 一级毛片视频免费| 国产一级淫片免费播放电影 | 免费无码午夜福利片| 日本免费中文字幕在线看| ww亚洲ww在线观看国产| 国产免费的野战视频| va亚洲va日韩不卡在线观看| 亚洲人成电影网站色www| 在线观看特色大片免费视频 | 亚洲第一街区偷拍街拍| 一二三四在线播放免费观看中文版视频| 中文字幕亚洲综合久久2| 无码精品国产一区二区三区免费 | 暖暖日本免费中文字幕|