/* 简单vml操作,用于连线 2011-1-20
注意事项:1.页面上 xmlns:v="urn:schemas-microsoft-com:vml"
<?import namespace="v" implementation="#default#VML" ?>
<style>
v\:line, v\:rect, v\:imagedata,v:group
{
display: inline-block;
}
</style>
<v:group id="group1" style="position: relative; height:768px; 1024px;" coordsize="1024,768"></v:group>
*/
var VmlHelper = function (leftAdjust, topAdjust, leftEndAdjust, topEndAdjust, strokecolor, strokeweight, endarrow) {
this.leftAdjust = leftAdjust;
this.topAdjust = topAdjust;
this.leftEndAdjust = leftEndAdjust;
this.topEndAdjust = topEndAdjust;
if (strokecolor) {
this.strokecolor = strokecolor;
} else { this.strokecolor = "red"; };
if (strokeweight) {
this.strokeweight = strokeweight;
} else { this.strokeweight = "1pt"; };
if (endarrow) {
this.endarrow = endarrow;
} else { this.endarrow = "Classic"; };
}
VmlHelper.prototype = {
GenLineOneByOne: function (args) {
var le;
var x1 = 0;
var y1 = 0;
var x2 = 0;
var y2 = 0;
for (var i = 0; i < arguments.length - 1; i++) {
le = document.createElement("<v:line ><v:line/>");
x1 = $("#" + arguments[i]).offset().left + ($("#" + arguments[i]).width() / 2) + this.leftAdjust;
y1 = $("#" + arguments[i]).offset().top + ($("#" + arguments[i]).height()) + this.topAdjust;
x2 = $("#" + arguments[i + 1]).offset().left + ($("#" + arguments[i + 1]).width() / 2) + this.leftEndAdjust;
y2 = $("#" + arguments[i + 1]).offset().top + this.topEndAdjust;
le.from = x1 + "," + y1;
le.to = x2 + "," + y2;
le.strokecolor = this.strokecolor;
le.strokeweight = this.strokeweight;
le.stroke.endarrow = this.endarrow;
group1.insertBefore(le)
} //for-End
}, //prototype-GenLineOneByOne-end
GenLineOneToManyH: function (args) { //一对多的水平方向
var line1 = document.createElement("<v:line > <v:line/>"); //顶部到横线
var arg1 = arguments[0];
var xFrom = $("#" + arg1).offset().left + ($("#" + arg1).width() / 2) + this.leftAdjust; //from
var yFrom = $("#" + arg1).offset().top + ($("#" + arg1).height()) + this.topAdjust; //from
var arg2 = arguments[1];
var x2 = $("#" + arg2).offset().left + ($("#" + arg2).width() / 2) + this.leftAdjust;
var y2 = $("#" + arg2).offset().top + this.topEndAdjust;
var yMid = yFrom + ((y2 - yFrom) / 2)//中线距离
line1.from = xFrom + "," + yFrom;
line1.to = xFrom + "," + yMid;
line1.strokecolor = this.strokecolor; ;
line1.strokeweight = this.strokeweight;
line1.stroke.endarrow = this.endarrow;
group1.insertBefore(line1);
var line2 = document.createElement("<v:line > <v:line/>"); //横线
var argLast = arguments[arguments.length - 1];
var xLast = $("#" + argLast).offset().left + ($("#" + argLast).width() / 2) + this.leftAdjust;
line2.strokecolor = "red";
line2.strokeweight = "1pt";
line2.from = x2 + "," + yMid;
line2.to = xLast + "," + yMid;
group1.insertBefore(line2)
var lineV;
var x1 = 0;
var x2 = 0;
var y2 = 0;
for (var i = 1; i < arguments.length; i++) {
lineV = document.createElement("<v:line > <v:line/>"); //纵向
lineV.strokecolor = this.strokecolor;
lineV.strokeweight = this.strokeweight;
lineV.stroke.endarrow = this.endarrow;
x1 = $("#" + arguments[i]).offset().left + ($("#" + argLast).width() / 2) + this.leftAdjust;
x2 = $("#" + arguments[i]).offset().left + ($("#" + argLast).width() / 2) + this.leftAdjust;
y2 = $("#" + arguments[i]).offset().top + this.topEndAdjust;
lineV.from = x1 + "," + yMid;
lineV.to = x2 + "," + y2;
group1.insertBefore(lineV)
} //for-end
}, //GenLineOneToManyH-end
GenLineOneToManyV: function (args) {//垂直方向一对多
var arg1, argLast;
arg1 = arguments[0];
argLast = arguments[arguments.length - 1]
var xFrom, yFrom;
xFrom = $("#" + arg1).offset().left + ($("#" + arg1).width() / 2) + this.leftAdjust;
yFrom = $("#" + arg1).offset().top + $("#" + arg1).height() + this.topAdjust;
var xLast, yLast;
xLast = $("#" + argLast).offset().left + this.leftEndAdjust;
yLast = $("#" + argLast).offset().top + ($("#" + argLast).height() / 2) + this.topEndAdjust
var polyLine = document.createElement("<v:PolyLine> <v:PolyLine>");
polyLine.points.value = xFrom + "," + yFrom + " " + xFrom + "," + yLast + " " + xLast + "," + yLast;
polyLine.strokecolor = this.strokecolor;
polyLine.strokeweight = this.strokeweight;
polyLine.stroke.endarrow = this.endarrow;
polyLine.fillColor = "#F0F0F0";
group1.insertBefore(polyLine);
var lineH;
var xH;
var yH;
for (var i = 1; i < arguments.length - 1; i++) {
lineH = document.createElement("<v:line > <v:line/>");
lineH.strokecolor = this.strokecolor;
lineH.strokeweight = this.strokeweight;
lineH.stroke.endarrow = this.endarrow;
xH = $("#" + arguments[i]).offset().left + this.leftEndAdjust;
yH = $("#" + arguments[i]).offset().top + ($("#" + arguments[i]).height() / 2) + this.topEndAdjust;
lineH.from = xFrom + "," + yH;
lineH.to = xH + "," + yH;
group1.insertBefore(lineH);
}
}, //GenLineOneToManyV-end
GenPolyLine: function (e1, e2, shap) {
var xFrom, yFrom, xEnd, yEnd;
var xM1, yM1, xM2, yM2;
var polyLine = document.createElement("<v:PolyLine> <v:PolyLine>");
polyLine.strokecolor = this.strokecolor;
polyLine.strokeweight = this.strokeweight;
polyLine.stroke.endarrow = this.endarrow;
polyLine.fillColor = "#F0F0F0";
xFrom = $("#" + e1).offset().left + ($("#" + e1).width() / 2) + this.leftAdjust;
yFrom = $("#" + e1).offset().top + $("#" + e1).height() + this.topAdjust;
xEnd = $("#" + e2).offset().left + ($("#" + e2).width() / 2) + this.leftAdjust;
yEnd = $("#" + e2).offset().top + this.topEndAdjust;
switch (shap) {
case "L":
break;
case "Z":
xM1 = xFrom;
xM2 = xEnd;
yM1 = (yFrom + ((yEnd - yFrom) / 2));
yM2 = (yFrom + ((yEnd - yFrom) / 2));
polyLine.points.value = xFrom + "," + yFrom + " " + xM1 + "," + yM1 + " " + xM2 + "," + yM2 + " " + xEnd + "," + yEnd;
group1.insertBefore(polyLine);
break;
default:
break;
}
} //GenPolyLine-end
}//prototype-end