TWaver Forums
http://twaver.servasoft.com/forum/

getViewRect方法返回的对象无法拿到width,height,提示undefine
http://twaver.servasoft.com/forum/viewtopic.php?f=35&t=6148
Page 1 of 1

Author:  Gorder [ 2019-04-28 16:01 ]
Post subject:  getViewRect方法返回的对象无法拿到width,height,提示undefine

为了使自动布局的网元名称不重叠,去重写getDimension方法,如下,但是始终打印出空
Code:
autoLayouter.getDimension = function (node) {
                var ui = network.getElementUI(node);
                console.info(ui)
                console.info(ui.getViewRect());
                if (ui) {
                    return {width: 120, height: 80};
                    // return {width: ui.getBodyRect().width, height: ui.getBodyRect().height};
                } else {
                    return null;
                }
            };


以下是全量代码
Code:
<script type="text/javascript">


        function init() {
            var data = $.parseJSON('{"serviceACode":"99999000000000001263","linkList":[{"orderSeq":1,"linkId":"1","equipZPort":"00000000000000000236","isTop":1,"pwId":"1","equipACode":"11111000000000000013","tunnelId":"1","equipAPort":"00000000000000001502","equipZCode":"11111000000000000033","linkName":"pw1"},{"orderSeq":2,"linkId":"2","equipZPort":"00000000000000844624","isTop":0,"pwId":"2","equipACode":"11111000000000000033","tunnelId":"2","equipAPort":"00000000000000000238","equipZCode":"11111000000000000457","linkName":"pw2"},{"orderSeq":3,"linkId":"3","equipZPort":"00000000000000002626","isTop":0,"pwId":"3","equipACode":"11111000000000000457","tunnelId":"3","equipAPort":"00000000000000844638","equipZCode":"11111000000000000011","linkName":"pw3"},{"orderSeq":4,"linkId":"4","equipZPort":"00000000000000844170","isTop":1,"pwId":"4","equipACode":"11111000000000000011","tunnelId":"4","equipAPort":"00000000000000002627","equipZCode":"11111000000000000445","linkName":"pw4"},{"orderSeq":5,"linkId":"5","equipZPort":"00000000000000002627","isTop":0,"pwId":"5","equipACode":"11111000000000000445","tunnelId":"5","equipAPort":"00000000000000844170","equipZCode":"11111000000000000011","linkName":"pw5"},{"orderSeq":1,"linkId":"6","equipZPort":"00000000000000000236","isTop":0,"pwId":"6","equipACode":"11111000000000000013","tunnelId":"6","equipAPort":"00000000000000001502","equipZCode":"11111000000000000033","linkName":"pw6"},{"orderSeq":0,"linkId":"11","equipZPort":"","isTop":0,"pwId":"","equipACode":"99999000000000002254","tunnelId":"","equipAPort":"","equipZCode":"11111000000000000013","linkName":"Microwave"},{"orderSeq":0,"linkId":"10","equipZPort":"","isTop":0,"pwId":"","equipACode":"99999000000000002188","tunnelId":"","equipAPort":"","equipZCode":"11111000000000000013","linkName":"Microwave"},{"orderSeq":0,"linkId":"9","equipZPort":"","isTop":0,"pwId":"","equipACode":"99999000000000005141","tunnelId":"","equipAPort":"","equipZCode":"11111000000000000013","linkName":"Microwave"},{"orderSeq":0,"linkId":"8","equipZPort":"","isTop":0,"pwId":"","equipACode":"99999000000000001187","tunnelId":"","equipAPort":"","equipZCode":"11111000000000000013","linkName":"Microwave"},{"orderSeq":0,"linkId":"7","equipZPort":"","isTop":0,"pwId":"","equipACode":"99999000000000001215","tunnelId":"","equipAPort":"","equipZCode":"11111000000000000013","linkName":"Microwave"}],"serviceZCode":"99999000000000001265","serviceId":"1","serviceName":"业务测试001","nodeList":[{"imgName":"","locationY":"","locationX":"","tooltip":"","equipCode":"11111000000000000033","name2":"","name1":""},{"imgName":"","locationY":"","locationX":"","tooltip":"","equipCode":"11111000000000000011","name2":"","name1":""},{"imgName":"1660_SM_ALCATEL_","locationY":"","locationX":"","tooltip":"阿尔卡特","equipCode":"99999000000000001215","name2":"0F5508F8450248FCB2FFFDE435E56D08","name1":"AL_GC"},{"imgName":"OTHER_HW_PCM_","locationY":"","locationX":"","tooltip":"华为","equipCode":"99999000000000002254","name2":"6EFF0D1451A84A50AF0CA94182725E18","name1":"ZD59P-B"},{"imgName":"OTHER_NEC_PCM_","locationY":"","locationX":"","tooltip":"NEC","equipCode":"99999000000000002188","name2":"36792B9C617C4DFCBBBEBA3A1ABD6D7E","name1":"ZD4P-C"},{"imgName":"","locationY":"","locationX":"","tooltip":"","equipCode":"11111000000000000445","name2":"","name1":""},{"imgName":"","locationY":"","locationX":"","tooltip":"","equipCode":"11111000000000000457","name2":"","name1":""},{"imgName":"1660_SMC_ALCATEL_","locationY":"","locationX":"","tooltip":"阿尔卡特","equipCode":"99999000000000001187","name2":"69174B6810A64B6C977E40DAB43A84F9","name1":"AL_LH"},{"imgName":"","locationY":"","locationX":"","tooltip":"","equipCode":"11111000000000000013","name2":"","name1":""},{"imgName":"OTHER_JNB_PCM_","locationY":"","locationX":"","tooltip":"桂林金泽","equipCode":"99999000000000005141","name2":"D07C659853D84993BC9C8CE2B9E2662E","name1":"LZDD2P-B"}]}');
            var nodeList = data.nodeList;
            var pathList = data.linkList;
            var box = new twaver.ElementBox();
            var network = new twaver.vector.Network(box);
            var autoLayouter = new twaver.layout.AutoLayouter(box);

            //禁用画布拖拽和鼠标滚轮缩放
            network.setDragToPan(false);
            network.setWheelToZoom(false);
            network.setLimitViewInCanvas(true);
            network._doubleClickToLinkBundle = false;
            // 设置画布位置
            var main = $("#main");
            main.append(network.getView());
            network.adjustBounds({x:0,y:0,width:document.documentElement.clientWidth,height:document.documentElement.clientHeight});
            // network.adjustBounds({x: (document.documentElement.clientWidth-1800)/2, y: (document.documentElement.clientHeight-1800)/2, width: 1800, height: 1800});
            twaver.Link.prototype.isAdjustedToBottom = function () {
                return true;
            };
            // TODO 右键菜单

            // 生成节点
            nodeList.forEach(function(nodeData){
                var node = new twaver.Node(nodeData.equipCode);
                node.setName(nodeData.name1);
                node.setName2(nodeData.name2);
                // node.setName2(nodeData.tooltip);
                node.setToolTip(nodeData.tooltip);
                // node.setImageUrl("/imService/plugins/topo/newtopo/images/svg/IPRan/"+nodeData.imgName+".svg")
                node.setStyle('select.style','border');
                node.setStyle('select.color','red');
                node.setStyle('label.font','12px');
                node.setStyle('label.position','bottom.bottom');
                box.add(node);
                var ui = network.getElementUI(node);
                console.info(ui.getViewRect());
            });

            pathList.forEach(function (path) {
                var line = new twaver.Link(path.linkId, box.getDataById(path.equipACode), box.getDataById(path.equipZCode))
                line.setName(path.linkName);
                // line.setToolTip(pw.pwName);
                line.setStyle('link.width', 2);
                line.setStyle('link.color', '#00FF00');
                if(path.linkName == 'Microwave'){
                    line.setStyle("link.pattern", [6,3]);
                    line.setStyle('link.color', '#8DAAA1');
                }
                if (path.isTop == 1) {
                    line.setStyle('label.position', 'top.top');
                } else {
                    line.setStyle('label.position', 'bottom.bottom');
                }
                box.add(line);
            });


            autoLayouter.getDimension = function (node) {
                var ui = network.getElementUI(node);
                console.info(ui)
                console.info(ui.getViewRect());
                if (ui) {
                    return {width: 120, height: 80};
                    // return {width: ui.getBodyRect().width, height: ui.getBodyRect().height};
                } else {
                    return null;
                }
            };
            autoLayouter.setAnimate(false);
            autoLayouter.doLayout('rightleft');
            autoLayouter.setAnimate(true);
        }
    </script>
</head>
<body onload="init()">
<div id='main' style="border:1px red solid;">
</div>

Author:  Paddy [ 2019-09-16 18:17 ]
Post subject:  Re: getViewRect方法返回的对象无法拿到width,height,提示undefine

您好,非常抱歉现在才回您的贴子,重写getDimension需要这样写:
Code:
var oldGetDimensionFunction = autoLayouter.getDimension;
    autoLayouter.getDimension = function(element) {
      var size = oldGetDimensionFunction.call(autoLayouter, element);
      return { width: size.width , height: size.height };
    };

Author:  Paddy [ 2019-09-17 9:36 ]
Post subject:  Re: getViewRect方法返回的对象无法拿到width,height,提示undefine

导致ui.getViewRect为空的原因是还没有绘制完成,可以调用ui.validate()。
您可以多试试,有问题我们再讨论。

Page 1 of 1 All times are UTC + 8 hours
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/