@joint/core 4.0.0

package/src/g/point.mjs

@@ -0,0 +1,375 @@
+/*
+    Point is the most basic object consisting of x/y coordinate.
+
+    Possible instantiations are:
+    * `Point(10, 20)`
+    * `new Point(10, 20)`
+    * `Point('10 20')`
+    * `Point(Point(10, 20))`
+*/
+import { normalizeAngle, random, snapToGrid, toDeg, toRad } from './geometry.helpers.mjs';
+import { bearing } from './line.bearing.mjs';
+import { squaredLength } from './line.squaredLength.mjs';
+import { length } from './line.length.mjs';
+import { types } from './types.mjs';
+
+const {
+    abs,
+    cos,
+    sin,
+    sqrt,
+    min,
+    max,
+    atan2,
+    round,
+    pow,
+    PI
+} = Math;
+
+export const Point = function(x, y) {
+
+    if (!(this instanceof Point)) {
+        return new Point(x, y);
+    }
+
+    if (typeof x === 'string') {
+        var xy = x.split(x.indexOf('@') === -1 ? ' ' : '@');
+        x = parseFloat(xy[0]);
+        y = parseFloat(xy[1]);
+
+    } else if (Object(x) === x) {
+        y = x.y;
+        x = x.x;
+    }
+
+    this.x = x === undefined ? 0 : x;
+    this.y = y === undefined ? 0 : y;
+};
+
+// Alternative constructor, from polar coordinates.
+// @param {number} Distance.
+// @param {number} Angle in radians.
+// @param {point} [optional] Origin.
+Point.fromPolar = function(distance, angle, origin) {
+
+    origin = new Point(origin);
+    var x = abs(distance * cos(angle));
+    var y = abs(distance * sin(angle));
+    var deg = normalizeAngle(toDeg(angle));
+
+    if (deg < 90) {
+        y = -y;
+
+    } else if (deg < 180) {
+        x = -x;
+        y = -y;
+
+    } else if (deg < 270) {
+        x = -x;
+    }
+
+    return new Point(origin.x + x, origin.y + y);
+};
+
+// Create a point with random coordinates that fall into the range `[x1, x2]` and `[y1, y2]`.
+Point.random = function(x1, x2, y1, y2) {
+
+    return new Point(random(x1, x2), random(y1, y2));
+};
+
+Point.prototype = {
+
+    type: types.Point,
+
+    chooseClosest: function(points) {
+
+        var n = points.length;
+        if (n === 1) return new Point(points[0]);
+        var closest = null;
+        var minSqrDistance = Infinity;
+        for (var i = 0; i < n; i++) {
+            var p = new Point(points[i]);
+            var sqrDistance = this.squaredDistance(p);
+            if (sqrDistance < minSqrDistance) {
+                closest = p;
+                minSqrDistance = sqrDistance;
+            }
+        }
+        return closest;
+    },
+
+    // If point lies outside rectangle `r`, return the nearest point on the boundary of rect `r`,
+    // otherwise return point itself.
+    // (see Squeak Smalltalk, Point>>adhereTo:)
+    adhereToRect: function(r) {
+
+        if (r.containsPoint(this)) {
+            return this;
+        }
+
+        this.x = min(max(this.x, r.x), r.x + r.width);
+        this.y = min(max(this.y, r.y), r.y + r.height);
+        return this;
+    },
+
+    // Compute the angle between vector from me to p1 and the vector from me to p2.
+    // ordering of points p1 and p2 is important!
+    // theta function's angle convention:
+    // returns angles between 0 and 180 when the angle is counterclockwise
+    // returns angles between 180 and 360 to convert clockwise angles into counterclockwise ones
+    // returns NaN if any of the points p1, p2 is coincident with this point
+    angleBetween: function(p1, p2) {
+
+        var angleBetween = (this.equals(p1) || this.equals(p2)) ? NaN : (this.theta(p2) - this.theta(p1));
+
+        if (angleBetween < 0) {
+            angleBetween += 360; // correction to keep angleBetween between 0 and 360
+        }
+
+        return angleBetween;
+    },
+
+    // Return the bearing between me and the given point.
+    bearing: function(point) {
+        return bearing(this, point);
+    },
+
+    // Returns change in angle from my previous position (-dx, -dy) to my new position
+    // relative to ref point.
+    changeInAngle: function(dx, dy, ref) {
+
+        // Revert the translation and measure the change in angle around x-axis.
+        return this.clone().offset(-dx, -dy).theta(ref) - this.theta(ref);
+    },
+
+    clone: function() {
+
+        return new Point(this);
+    },
+
+    // Returns the cross product of this point relative to two other points
+    // this point is the common point
+    // point p1 lies on the first vector, point p2 lies on the second vector
+    // watch out for the ordering of points p1 and p2!
+    // positive result indicates a clockwise ("right") turn from first to second vector
+    // negative result indicates a counterclockwise ("left") turn from first to second vector
+    // zero indicates that the first and second vector are collinear
+    // note that the above directions are reversed from the usual answer on the Internet
+    // that is because we are in a left-handed coord system (because the y-axis points downward)
+    cross: function(p1, p2) {
+
+        return (p1 && p2) ? (((p2.x - this.x) * (p1.y - this.y)) - ((p2.y - this.y) * (p1.x - this.x))) : NaN;
+    },
+
+    difference: function(dx, dy) {
+
+        if ((Object(dx) === dx)) {
+            dy = dx.y;
+            dx = dx.x;
+        }
+
+        return new Point(this.x - (dx || 0), this.y - (dy || 0));
+    },
+
+    // Returns distance between me and point `p`.
+    distance: function(p) {
+        return length(this, p);
+    },
+
+    // Returns the dot product of this point with given other point
+    dot: function(p) {
+
+        return p ? (this.x * p.x + this.y * p.y) : NaN;
+    },
+
+    equals: function(p) {
+
+        return !!p &&
+            this.x === p.x &&
+            this.y === p.y;
+    },
+
+    // Linear interpolation
+    lerp: function(p, t) {
+
+        var x = this.x;
+        var y = this.y;
+        return new Point((1 - t) * x + t * p.x, (1 - t) * y + t * p.y);
+    },
+
+    magnitude: function() {
+
+        return sqrt((this.x * this.x) + (this.y * this.y)) || 0.01;
+    },
+
+    // Returns a manhattan (taxi-cab) distance between me and point `p`.
+    manhattanDistance: function(p) {
+
+        return abs(p.x - this.x) + abs(p.y - this.y);
+    },
+
+    // Move point on line starting from ref ending at me by
+    // distance distance.
+    move: function(ref, distance) {
+
+        var theta = toRad((new Point(ref)).theta(this));
+        var offset = this.offset(cos(theta) * distance, -sin(theta) * distance);
+        return offset;
+    },
+
+    // Scales x and y such that the distance between the point and the origin (0,0) is equal to the given length.
+    normalize: function(length) {
+
+        var scale = (length || 1) / this.magnitude();
+        return this.scale(scale, scale);
+    },
+
+    // Offset me by the specified amount.
+    offset: function(dx, dy) {
+
+        if ((Object(dx) === dx)) {
+            dy = dx.y;
+            dx = dx.x;
+        }
+
+        this.x += dx || 0;
+        this.y += dy || 0;
+        return this;
+    },
+
+    // Returns a point that is the reflection of me with
+    // the center of inversion in ref point.
+    reflection: function(ref) {
+
+        return (new Point(ref)).move(this, this.distance(ref));
+    },
+
+    // Rotate point by angle around origin.
+    // Angle is flipped because this is a left-handed coord system (y-axis points downward).
+    rotate: function(origin, angle) {
+
+        if (angle === 0) return this;
+
+        origin = origin || new Point(0, 0);
+
+        angle = toRad(normalizeAngle(-angle));
+        var cosAngle = cos(angle);
+        var sinAngle = sin(angle);
+
+        var x = (cosAngle * (this.x - origin.x)) - (sinAngle * (this.y - origin.y)) + origin.x;
+        var y = (sinAngle * (this.x - origin.x)) + (cosAngle * (this.y - origin.y)) + origin.y;
+
+        this.x = x;
+        this.y = y;
+        return this;
+    },
+
+    round: function(precision) {
+
+        let f = 1; // case 0
+        if (precision) {
+            switch (precision) {
+                case 1: f = 10; break;
+                case 2: f = 100; break;
+                case 3: f = 1000; break;
+                default: f = pow(10, precision); break;
+            }
+        }
+
+        this.x = round(this.x * f) / f;
+        this.y = round(this.y * f) / f;
+        return this;
+    },
+
+    // Scale point with origin.
+    scale: function(sx, sy, origin) {
+
+        origin = (origin && new Point(origin)) || new Point(0, 0);
+        this.x = origin.x + sx * (this.x - origin.x);
+        this.y = origin.y + sy * (this.y - origin.y);
+        return this;
+    },
+
+    snapToGrid: function(gx, gy) {
+
+        this.x = snapToGrid(this.x, gx);
+        this.y = snapToGrid(this.y, gy || gx);
+        return this;
+    },
+
+    squaredDistance: function(p) {
+        return squaredLength(this, p);
+    },
+
+    // Compute the angle between me and `p` and the x axis.
+    // (cartesian-to-polar coordinates conversion)
+    // Return theta angle in degrees.
+    theta: function(p) {
+
+        p = new Point(p);
+
+        // Invert the y-axis.
+        var y = -(p.y - this.y);
+        var x = p.x - this.x;
+        var rad = atan2(y, x); // defined for all 0 corner cases
+
+        // Correction for III. and IV. quadrant.
+        if (rad < 0) {
+            rad = 2 * PI + rad;
+        }
+
+        return 180 * rad / PI;
+    },
+
+    toJSON: function() {
+
+        return { x: this.x, y: this.y };
+    },
+
+    // Converts rectangular to polar coordinates.
+    // An origin can be specified, otherwise it's 0@0.
+    toPolar: function(o) {
+
+        o = (o && new Point(o)) || new Point(0, 0);
+        var x = this.x;
+        var y = this.y;
+        this.x = sqrt((x - o.x) * (x - o.x) + (y - o.y) * (y - o.y)); // r
+        this.y = toRad(o.theta(new Point(x, y)));
+        return this;
+    },
+
+    toString: function() {
+
+        return this.x + '@' + this.y;
+    },
+
+    serialize: function() {
+
+        return this.x + ',' + this.y;
+    },
+
+    update: function(x, y) {
+
+        if ((Object(x) === x)) {
+            y = x.y;
+            x = x.x;
+        }
+
+        this.x = x || 0;
+        this.y = y || 0;
+        return this;
+    },
+
+    // Compute the angle between the vector from 0,0 to me and the vector from 0,0 to p.
+    // Returns NaN if p is at 0,0.
+    vectorAngle: function(p) {
+
+        var zero = new Point(0, 0);
+        return zero.angleBetween(this, p);
+    }
+};
+
+Point.prototype.translate = Point.prototype.offset;
+
+// For backwards compatibility:
+export const point = Point;

package/src/g/points.mjs

@@ -0,0 +1,247 @@
+export function parsePoints(svgString) {
+
+    // Step 1: Discard surrounding spaces
+    const trimmedString = svgString.trim();
+    if (trimmedString === '') return [];
+
+    const points = [];
+
+    // Step 2: Split at commas (+ their surrounding spaces) or at multiple spaces
+    // ReDoS mitigation: Have an anchor at the beginning of each alternation
+    // Note: This doesn't simplify double (or more) commas - causes empty coords
+    // This regex is used by `split()`, so it doesn't need to use /g
+    const coords = trimmedString.split(/\b\s*,\s*|,\s*|\s+/);
+
+    const numCoords = coords.length;
+    for (let i = 0; i < numCoords; i += 2) {
+        // Step 3: Convert each coord to number
+        // Note: If the coord cannot be converted to a number, it will be `NaN`
+        // Note: If the coord is empty ("", e.g. from ",," input), it will be `0`
+        // Note: If we end up with an odd number of coords, the last point's second coord will be `NaN`
+        points.push({ x: +coords[i], y: +coords[i + 1] });
+    }
+    return points;
+}
+
+export function clonePoints(points) {
+    const numPoints = points.length;
+    if (numPoints === 0) return [];
+    const newPoints = [];
+    for (let i = 0; i < numPoints; i++) {
+        const point = points[i].clone();
+        newPoints.push(point);
+    }
+    return newPoints;
+}
+
+// Returns a convex-hull polyline from this polyline.
+// Implements the Graham scan (https://en.wikipedia.org/wiki/Graham_scan).
+// Output polyline starts at the first element of the original polyline that is on the hull, then continues clockwise.
+// Minimal polyline is found (only vertices of the hull are reported, no collinear points).
+export function convexHull(points) {
+
+    const { abs } = Math;
+
+    var i;
+    var n;
+
+    var numPoints = points.length;
+    if (numPoints === 0) return []; // if points array is empty
+
+    // step 1: find the starting point - point with the lowest y (if equality, highest x)
+    var startPoint;
+    for (i = 0; i < numPoints; i++) {
+        if (startPoint === undefined) {
+            // if this is the first point we see, set it as start point
+            startPoint = points[i];
+
+        } else if (points[i].y < startPoint.y) {
+            // start point should have lowest y from all points
+            startPoint = points[i];
+
+        } else if ((points[i].y === startPoint.y) && (points[i].x > startPoint.x)) {
+            // if two points have the lowest y, choose the one that has highest x
+            // there are no points to the right of startPoint - no ambiguity about theta 0
+            // if there are several coincident start point candidates, first one is reported
+            startPoint = points[i];
+        }
+    }
+
+    // step 2: sort the list of points
+    // sorting by angle between line from startPoint to point and the x-axis (theta)
+
+    // step 2a: create the point records = [point, originalIndex, angle]
+    var sortedPointRecords = [];
+    for (i = 0; i < numPoints; i++) {
+
+        var angle = startPoint.theta(points[i]);
+        if (angle === 0) {
+            angle = 360; // give highest angle to start point
+            // the start point will end up at end of sorted list
+            // the start point will end up at beginning of hull points list
+        }
+
+        var entry = [points[i], i, angle];
+        sortedPointRecords.push(entry);
+    }
+
+    // step 2b: sort the list in place
+    sortedPointRecords.sort(function(record1, record2) {
+        // returning a negative number here sorts record1 before record2
+        // if first angle is smaller than second, first angle should come before second
+
+        var sortOutput = record1[2] - record2[2];  // negative if first angle smaller
+        if (sortOutput === 0) {
+            // if the two angles are equal, sort by originalIndex
+            sortOutput = record2[1] - record1[1]; // negative if first index larger
+            // coincident points will be sorted in reverse-numerical order
+            // so the coincident points with lower original index will be considered first
+        }
+
+        return sortOutput;
+    });
+
+    // step 2c: duplicate start record from the top of the stack to the bottom of the stack
+    if (sortedPointRecords.length > 2) {
+        var startPointRecord = sortedPointRecords[sortedPointRecords.length - 1];
+        sortedPointRecords.unshift(startPointRecord);
+    }
+
+    // step 3a: go through sorted points in order and find those with right turns
+    // we want to get our results in clockwise order
+    var insidePoints = {}; // dictionary of points with left turns - cannot be on the hull
+    var hullPointRecords = []; // stack of records with right turns - hull point candidates
+
+    var currentPointRecord;
+    var currentPoint;
+    var lastHullPointRecord;
+    var lastHullPoint;
+    var secondLastHullPointRecord;
+    var secondLastHullPoint;
+    while (sortedPointRecords.length !== 0) {
+
+        currentPointRecord = sortedPointRecords.pop();
+        currentPoint = currentPointRecord[0];
+
+        // check if point has already been discarded
+        // keys for insidePoints are stored in the form 'point.x@point.y@@originalIndex'
+        if (insidePoints.hasOwnProperty(currentPointRecord[0] + '@@' + currentPointRecord[1])) {
+            // this point had an incorrect turn at some previous iteration of this loop
+            // this disqualifies it from possibly being on the hull
+            continue;
+        }
+
+        var correctTurnFound = false;
+        while (!correctTurnFound) {
+
+            if (hullPointRecords.length < 2) {
+                // not enough points for comparison, just add current point
+                hullPointRecords.push(currentPointRecord);
+                correctTurnFound = true;
+
+            } else {
+                lastHullPointRecord = hullPointRecords.pop();
+                lastHullPoint = lastHullPointRecord[0];
+                secondLastHullPointRecord = hullPointRecords.pop();
+                secondLastHullPoint = secondLastHullPointRecord[0];
+
+                var crossProduct = secondLastHullPoint.cross(lastHullPoint, currentPoint);
+
+                if (crossProduct < 0) {
+                    // found a right turn
+                    hullPointRecords.push(secondLastHullPointRecord);
+                    hullPointRecords.push(lastHullPointRecord);
+                    hullPointRecords.push(currentPointRecord);
+                    correctTurnFound = true;
+
+                } else if (crossProduct === 0) {
+                    // the three points are collinear
+                    // three options:
+                    // there may be a 180 or 0 degree angle at lastHullPoint
+                    // or two of the three points are coincident
+                    var THRESHOLD = 1e-10; // we have to take rounding errors into account
+                    var angleBetween = lastHullPoint.angleBetween(secondLastHullPoint, currentPoint);
+                    if (abs(angleBetween - 180) < THRESHOLD) { // rounding around 180 to 180
+                        // if the cross product is 0 because the angle is 180 degrees
+                        // discard last hull point (add to insidePoints)
+                        //insidePoints.unshift(lastHullPoint);
+                        insidePoints[lastHullPointRecord[0] + '@@' + lastHullPointRecord[1]] = lastHullPoint;
+                        // reenter second-to-last hull point (will be last at next iter)
+                        hullPointRecords.push(secondLastHullPointRecord);
+                        // do not do anything with current point
+                        // correct turn not found
+
+                    } else if (lastHullPoint.equals(currentPoint) || secondLastHullPoint.equals(lastHullPoint)) {
+                        // if the cross product is 0 because two points are the same
+                        // discard last hull point (add to insidePoints)
+                        //insidePoints.unshift(lastHullPoint);
+                        insidePoints[lastHullPointRecord[0] + '@@' + lastHullPointRecord[1]] = lastHullPoint;
+                        // reenter second-to-last hull point (will be last at next iter)
+                        hullPointRecords.push(secondLastHullPointRecord);
+                        // do not do anything with current point
+                        // correct turn not found
+
+                    } else if (abs(((angleBetween + 1) % 360) - 1) < THRESHOLD) { // rounding around 0 and 360 to 0
+                        // if the cross product is 0 because the angle is 0 degrees
+                        // remove last hull point from hull BUT do not discard it
+                        // reenter second-to-last hull point (will be last at next iter)
+                        hullPointRecords.push(secondLastHullPointRecord);
+                        // put last hull point back into the sorted point records list
+                        sortedPointRecords.push(lastHullPointRecord);
+                        // we are switching the order of the 0deg and 180deg points
+                        // correct turn not found
+                    }
+
+                } else {
+                    // found a left turn
+                    // discard last hull point (add to insidePoints)
+                    //insidePoints.unshift(lastHullPoint);
+                    insidePoints[lastHullPointRecord[0] + '@@' + lastHullPointRecord[1]] = lastHullPoint;
+                    // reenter second-to-last hull point (will be last at next iter of loop)
+                    hullPointRecords.push(secondLastHullPointRecord);
+                    // do not do anything with current point
+                    // correct turn not found
+                }
+            }
+        }
+    }
+    // at this point, hullPointRecords contains the output points in clockwise order
+    // the points start with lowest-y,highest-x startPoint, and end at the same point
+
+    // step 3b: remove duplicated startPointRecord from the end of the array
+    if (hullPointRecords.length > 2) {
+        hullPointRecords.pop();
+    }
+
+    // step 4: find the lowest originalIndex record and put it at the beginning of hull
+    var lowestHullIndex; // the lowest originalIndex on the hull
+    var indexOfLowestHullIndexRecord = -1; // the index of the record with lowestHullIndex
+    n = hullPointRecords.length;
+    for (i = 0; i < n; i++) {
+
+        var currentHullIndex = hullPointRecords[i][1];
+
+        if (lowestHullIndex === undefined || currentHullIndex < lowestHullIndex) {
+            lowestHullIndex = currentHullIndex;
+            indexOfLowestHullIndexRecord = i;
+        }
+    }
+
+    var hullPointRecordsReordered = [];
+    if (indexOfLowestHullIndexRecord > 0) {
+        var newFirstChunk = hullPointRecords.slice(indexOfLowestHullIndexRecord);
+        var newSecondChunk = hullPointRecords.slice(0, indexOfLowestHullIndexRecord);
+        hullPointRecordsReordered = newFirstChunk.concat(newSecondChunk);
+
+    } else {
+        hullPointRecordsReordered = hullPointRecords;
+    }
+
+    var hullPoints = [];
+    n = hullPointRecordsReordered.length;
+    for (i = 0; i < n; i++) {
+        hullPoints.push(hullPointRecordsReordered[i][0]);
+    }
+
+    return hullPoints;
+}

package/src/g/polygon.mjs

@@ -0,0 +1,51 @@
+import { Point } from './point.mjs';
+import { Polyline } from './polyline.mjs';
+import { extend } from './extend.mjs';
+import { types } from './types.mjs';
+import { clonePoints, parsePoints, convexHull } from './points.mjs';
+
+export const Polygon = function(points) {
+
+    if (!(this instanceof Polygon)) {
+        return new Polygon(points);
+    }
+
+    if (typeof points === 'string') {
+        return new Polygon.parse(points);
+    }
+
+    this.points = (Array.isArray(points) ? points.map(Point) : []);
+};
+
+Polygon.parse = function(svgString) {
+    return new Polygon(parsePoints(svgString));
+};
+
+Polygon.fromRect = function(rect) {
+    return new Polygon([
+        rect.topLeft(),
+        rect.topRight(),
+        rect.bottomRight(),
+        rect.bottomLeft()
+    ]);
+};
+
+Polygon.prototype = extend(Polyline.prototype, {
+
+    type: types.Polygon,
+
+    clone: function() {
+        return new Polygon(clonePoints(this.points));
+    },
+
+    convexHull: function() {
+        return new Polygon(convexHull(this.points));
+    },
+
+    lengthPoints: function() {
+        const { start, end, points } = this;
+        if (points.length <= 1 || start.equals(end)) return points;
+        return [...points, start.clone()];
+    }
+
+});