changeset 1370:eaa128e7cb14

more line geometry functions; steps towards oval construction
author hertzhaft
date Mon, 23 Feb 2015 01:01:35 +0100
parents 7bf408354341
children a71ca1a6251c
files webapp/src/main/webapp/jquery/jquery.digilib.geometry.js webapp/src/main/webapp/jquery/jquery.digilib.measure.js
diffstat 2 files changed, 116 insertions(+), 40 deletions(-) [+]
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/jquery.digilib.geometry.js	Sun Feb 22 13:54:28 2015 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.geometry.js	Mon Feb 23 01:01:35 2015 +0100
@@ -214,16 +214,16 @@
      */
     var line = function(p, q) {
         var that = { // definition point
-            x: p.x,
-            y: p.y
+            x : p.x,
+            y : p.y
             };
-        if (q.x != null) {
+        if (q.x != null) { // second point
             that.dx = q.x - that.x;
             that.dy = q.y - that.y;
-        } else if ($.isArray(q)) {
-            that.dx = q[0]+0;
-            that.dy = q[1]+0;
-        } else if (q === 0) {
+        } else if ($.isArray(q)) { // vector
+            that.dx = q[0];
+            that.dy = q[1];
+        } else if (q === 0) { // slope
             that.dx = 0;
             that.dy = 1;
         } else if (q === Infinity) {
@@ -238,45 +238,108 @@
         } else {
             that.dx = 1;
             that.dy = 1;
-        }
+            }
+        // get/set origin of line
+        that.origin = function(p) {
+            if (p == null) {
+                return position(this.x, this.y);
+                }
+            this.x = p.x;
+            this.y = p.y;
+            return this;
+            };
+        // get/set vector
+        that.vector = function(vector) {
+            if (vector == null) {
+                return [this.dx, this.dy];
+                }
+            this.dx = vector[0];
+            this.dy = vector[1];
+            return this;
+            };
+        // vector
+        that.invertedVector = function() {
+            return [-this.dx, -this.dy];
+            };
+        // perpendicular vector
+        that.perpendicularVector = function(clockwise) {
+            return clockwise ? [-this.dy, this.dx] : [this.dy, -this.dx];
+            };
+        // get/set vector length
+        that.length = function(length) {
+            var dist = Math.sqrt(this.dx * this.dx + this.dy * this.dy);
+            if (length == null) {
+                return dist;
+                }
+            var ratio = length/dist;
+            this.dx *= ratio;
+            this.dy *= ratio
+            return this;
+            };
         // slope
         that.slope = function() {
             return this.dx/this.dy;
-        };
-
+            };
         // return a copy
         that.copy = function() {
-            return line(position(this.x, this.y), [this.dx, this.dy]);
-        };
+            return line(position(this.x, this.y), this.vector());
+            };
+        // invert direction
+        that.invert = function() {
+            this.vector(this.invertedVector);
+            return this;
+            };
         // return a parallel through a point
         that.parallel = function(p) {
-            return line(position(p.x, p.y), [this.dx, this.dy]);
-        };
-        // return perpendicular line, with optional directon
-        that.perpendicular = function(clockwise) {
-            var delta = clockwise ? [-this.dy, this.dx] : [this.dy, -this.dx];
-            return line(position(this.x, this.y), delta)
-        };
+            return line(position(p.x, p.y), this.vector());
+            };
+        // return perpendicular line, with optional directon or other point
+        that.perpendicular = function(p, clockwise) {
+            var point = (p == null || p.x == null)
+                ? position(this.x, this.y) : p;
+            return line(point, this.perpendicularVector(clockwise));
+            };
+        // return perpendicular point on line
+        that.perpendicularPoint = function(p) {
+            return this.intersection(this.perpendicular(p));
+            };
+        // return perpendicular line from point
+        that.perpendicularLine = function(p) {
+            return line(p, this.perpendicularPoint(p));
+            };
+        // return point in mirrored position (with regard to this line)
+        that.mirrorPoint = function(p) {
+            var line = this.perpendicularLine(p);
+            return line.add(line.vector());
+            };
         // return a point (position) by adding a vector to the definition point
-        that.add = function(q) {
-            return $.isArray(q)
-                ? position(this.x + q[0], this.y + q[1])
-                : position(this.x + q.x, this.y + q.y);
-        };
-        // point on line, moved from origin by factor
+        that.add = function(vector) {
+            return $.isArray(vector)
+                ? position(this.x + vector[0], this.y + vector[1])
+                : position(this.x + vector.x, this.y + vector.y);
+            };
+        // point on the line, moved from origin by factor
         that.point = function(factor) {
-            return position(this.x + factor*this.dx, this.y + factor*this.dy)
-        };
+            if (factor == null) { factor = 1; }
+            var vector = [factor*this.dx, factor*this.dy];
+            return this.add(vector);
+            };
+        // factor of point (assuming it is on the line)
+        that.factor = function(p) {
+            return (dx === 0)
+                ? (p.y - this.y)/this.dy
+                : (p.x - this.x)/this.dx;
+            };
         // intersection point with other line
         that.intersection = function(line) {
-            var det = this.dy*line.dx - this.dx*line.dy
-            if (det === 0) { // parallel
+            var denominator = this.dy*line.dx - this.dx*line.dy
+            if (denominator === 0) { // parallel
                 return null; }
-            var c = this.dx*(line.y - this. y) + this.dy*(this.x - line.x);
-            return line.point(c/det);
+            var num = this.dx*(line.y - this.y) + this.dy*(this.x - line.x);
+            return line.point(num/denominator);
+            };
+        return that;
         };
-        return that;
-    };
 
     /*
      * Rectangle class
--- a/webapp/src/main/webapp/jquery/jquery.digilib.measure.js	Sun Feb 22 13:54:28 2015 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.measure.js	Mon Feb 23 01:01:35 2015 +0100
@@ -1181,8 +1181,8 @@
             return $s;
             };
         factory['Rect'] = function (shape) {
+            var trafo = data.imgTrafo;
             var $s = factory['Polygon'](shape);
-            var trafo = data.imgTrafo;
             var props = shape.properties;
             props.maxvtx = 3;
             $s.place = function () {
@@ -1196,27 +1196,40 @@
                     var p2 = p3.copy().add(d);
                     p[2] = p2.mid(p3); // handle position
                     shape.geometry.coordinates[2] = trafo.invtransform(p[2]).toArray();
+                    props.pos = [p3, p2]; // save other points
                     }
                 this.attr({points: [p[0], p[1], p2, p3].join(" ")});
                 };
             return $s;
             };
         factory['Oval'] = function (shape) {
+            var trafo = data.imgTrafo;
             var $s = factory['Rect'](shape);
             var place = $s.place;
             var props = shape.properties;
             props.maxvtx = 4;
             var $g = $(fn.svgElement('g', {'id': shape.id + '-oval'}));
-            var $c = $(fn.svgElement('circle', {'id': shape.id + '-circle', stroke: props.stroke, fill: 'none'}));
-            $g.append($s).append($c);
+            var $c1 = $(fn.svgElement('circle', {'id': shape.id + '-circle1', stroke: props.stroke, fill: 'none'}));
+            var $c2 = $(fn.svgElement('circle', {'id': shape.id + '-circle2', stroke: props.stroke, fill: 'none'}));
+            var $l1 = $(fn.svgElement('line', {'id': shape.id + '-line1', stroke: props.stroke }));
+            var $l2 = $(fn.svgElement('line', {'id': shape.id + '-line2', stroke: props.stroke }));
+            $g.append($s).append($c1).append($c2).append($l1).append($l2);
             $g.place = function () {
                 var p = props.screenpos;
-                var vtx = props.vtx;
                 place.call($s);
                 if (p.length > 3) { // p[3] is the mouse pointer
-                    var m = p[2].mid(p[3]);
-                    var r = m.distance(p[2]);
-                    $c.attr({cx: m.x, cy: m.y, r: r});
+                    var mp0 = p[0].mid(p[1]);
+                    var line1 = geom.line(p[2], mp0);
+                    var mp1 = line1.perpendicularPoint(p[3]);
+                    var radius = mp1.distance(p[2]);
+                    var mp2 = geom.line(mp0, p[2]).length(radius).point();
+                    var pt = geom.line(p[0], p[1]).parallel(p[0].mid(props.pos[0])).length(radius).point();
+                    $c1.attr({cx: mp1.x, cy: mp1.y, r: radius});
+                    $c2.attr({cx: mp2.x, cy: mp2.y, r: radius});
+                    $l1.attr({x1: mp1.x, y1: mp1.y, x2 : pt.x, y2 : pt.y});
+                    $l2.attr({x1: mp2.x, y1: mp2.y, x2 : pt.x, y2 : pt.y});
+                    p[3] = mp1;
+                    shape.geometry.coordinates[3] = trafo.invtransform(p[3]).toArray();
                     }
                 };
             return $g;