//左对齐 function SelectAlignLeft() { var arr = getSelectedRegions(); var iLeft = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().left<iLeft||iLeft===0) { iLeft = $(arr[i]).position().left; } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("left", iLeft + "px"); } jsPlumb.repaintEverything(); } //居中对齐 function SelectAlignCenter() { var arr = getSelectedRegions(); var iLeft = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().left < iLeft || iLeft === 0) { iLeft = $(arr[i]).position().left + parseInt(GetStyle(arr[i],"width")) / 2; } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("left", (iLeft - parseInt(GetStyle(arr[j],"width")) / 2) + "px"); } jsPlumb.repaintEverything(); } //右对齐 function SelectAlignRight() { var arr = getSelectedRegions(); var iLeft = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().left + parseInt(GetStyle(arr[i], "width")) > iLeft || iLeft === 0) { iLeft = $(arr[i]).position().left + parseInt(GetStyle(arr[i], "width")); } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("left", (iLeft - parseInt(GetStyle(arr[j], "width"))) + "px"); } jsPlumb.repaintEverything(); } //上对齐 function SelectAlignTop() { var arr = getSelectedRegions(); var iTop = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().top < iTop || iTop === 0) { iTop = $(arr[i]).position().top; } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("top", iTop + "px"); } jsPlumb.repaintEverything(); } //垂直居中 function SelectAlignMiddle() { var arr = getSelectedRegions(); var iTop = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().top + parseInt(GetStyle(arr[i], "height")) / 2 < iTop || iTop === 0) { iTop = $(arr[i]).position().top + parseInt(GetStyle(arr[i], "height")) / 2; } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("top", (iTop - parseInt(GetStyle(arr[j], "height")) / 2) + "px"); } jsPlumb.repaintEverything(); } //下对齐 function SelectAlignBottom() { var arr = getSelectedRegions(); var iTop = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if ($(arr[i]).position().top + parseInt(GetStyle(arr[i], "height")) > iTop || iTop === 0) { iTop = $(arr[i]).position().top + parseInt(GetStyle(arr[i], "height")); } } for (var j = 0; j < arr.length; j++) { if (id !== arr[j].parentNode.id) continue; $(arr[j]).css("top", (iTop - parseInt(GetStyle(arr[j], "height"))) + "px"); } jsPlumb.repaintEverything(); } //上下靠拢 function SelectUpColse() { var arr = getSelectedRegions(); var iTop = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if (iTop === 0) iTop = $(arr[i]).position().top; $(arr[i]).css("top", iTop + "px"); iTop += parseInt(GetStyle(arr[i], "height")); } jsPlumb.repaintEverything(); } //左右靠拢 function SelectLeftColse() { var arr = getSelectedRegions(); var iLeft = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if (iLeft === 0) iLeft = $(arr[i]).position().left; $(arr[i]).css("left", iLeft + "px"); iLeft += parseInt(GetStyle(arr[i], "width")); } jsPlumb.repaintEverything(); } //同高 function SelectSameHeight() { var arr = getSelectedRegions(); var iHeigth = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if (iHeigth === 0) iHeigth = parseInt(GetStyle(arr[i], "height")); $(arr[i]).css("height", iHeigth+"px"); } jsPlumb.repaintEverything(); } //同宽 function SelectSameWidth() { var arr = getSelectedRegions(); var iWidth = 0; var id = ""; for (var i = 0; i < arr.length; i++) { if (id === "") id = arr[i].parentNode.id; if (id !== arr[i].parentNode.id) continue; if (iWidth === 0) iWidth = parseInt(GetStyle(arr[i], "width")); $(arr[i]).css("width", iWidth + "px"); } jsPlumb.repaintEverything(); } //旋转 function SelectClockwise(index) { var arr = getSelectedRegions(); //var iWidth = 0; //var id = ""; for (var i = 0; i < arr.length; i++) { //if (id === "") id = arr[i].parentNode.id; //if (id !== arr[i].parentNode.id) continue; var sIndex= arr[i].style.transform.replace("rotate(", "").replace("deg)", ""); var iNum = 0; if (sIndex) iNum = parseInt(sIndex); $(arr[i]).css("transform", "rotate(" + (iNum + index)%360 + "deg)"); var points = jsPlumb.getEndpoints(arr[i]); } jsPlumb.repaintEverything(); } //删除选中 function DeleteSelect() { var arr = getSelectedRegions(); for (var i = 0; i < arr.length; i++) { jsPlumb.remove(arr[i],true); //var points = jsPlumb.getEndpoints(arr[i]); //for (var j = 0; j < points.length; j++) { // jsPlumb.deleteEndpoint(points[j]); //} //arr[i].parentNode.removeChild(arr[i]); } jsPlumb.repaintEverything(); } function GetStyle(obj, attr) { if (obj.currentStyle) { return obj.currentStyle[attr]; //只适用于IE } else { return getComputedStyle(obj, false)[attr]; //只适用于FF,Chrome,Safa } return obj.style[attr]; //本人测试在IE和FF下没有用,chrome有用 }
代码可能有点乱，待整理。上章有博友就找我要过源码，这次出来一个初级的版本，希望可以帮助大家更好的学习流程图的核心技术JsPlumb。
您可能感兴趣的文章: