• VML


    /* 简单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

  • 相关阅读:
    Kafka usecase
    kafka 的quick start(windows平台)
    kafka介绍
    问题记录 为ubuntu16.04添加windows字体(解决JIRA图表乱码的问题)
    问题记录,如何解决confluence的office预览的时候的乱码问题
    为gitlab10.x增加使用remote_user HTTP头的方式登录
    基于spring-cloud的微服务(4)API网关zuul
    基于spring-cloud的微服务(3)eureka的客户端如何使用IP地址来进行注册
    基于spring-cloud的微服务(2) eureka服务提供方的注册和消费方的消费
    WebView 上传文件 WebChromeClient之openFileChooser函数
  • 原文地址:https://www.cnblogs.com/fuhui/p/1940326.html
Copyright © 2020-2023  润新知