@flatten-js/core

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta content="width=device-width,initial-scale=1" name="viewport"> <title>classes/multiline.js - Documentation</title> <script src="scripts/prettify/prettify.js"></script> <script src="scripts/prettify/lang-css.js"></script>  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" type="text/css"> <link href="styles/prettify-tomorrow.css" rel="stylesheet" type="text/css"> <link href="styles/jsdoc-default.css" rel="stylesheet" type="text/css"> </head> <body> <input class="nav-trigger" id="nav-trigger" type="checkbox" /> <label class="navicon-button x" for="nav-trigger"> <div class="navicon"></div> </label> <label class="overlay" for="nav-trigger"></label> <nav> <li class="nav-link nav-home-link"><a href="index.html">Home</a></li><li class="nav-heading">Classes</li><li class="nav-heading">C<a href="Arc.html">Arc</a></li><li class="nav-item">F<a href="Arc.html#clone">clone</a></li><li class="nav-item">F<a href="Arc.html#contains">contains</a></li><li class="nav-item">F<a href="Arc.html#split">split</a></li><li class="nav-item">F<a href="Arc.html#middle">middle</a></li><li class="nav-item">F<a href="Arc.html#chordHeight">chordHeight</a></li><li class="nav-item">F<a href="Arc.html#intersect">intersect</a></li><li class="nav-item">F<a href="Arc.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Arc.html#breakToFunctional">breakToFunctional</a></li><li class="nav-item">F<a href="Arc.html#tangentInStart">tangentInStart</a></li><li class="nav-item">F<a href="Arc.html#tangentInEnd">tangentInEnd</a></li><li class="nav-item">F<a href="Arc.html#reverse">reverse</a></li><li class="nav-item">F<a href="Arc.html#translate">translate</a></li><li class="nav-item">F<a href="Arc.html#rotate">rotate</a></li><li class="nav-item">F<a href="Arc.html#scale">scale</a></li><li class="nav-item">F<a href="Arc.html#transform">transform</a></li><li class="nav-item">F<a href="Arc.html#sortPoints">sortPoints</a></li><li class="nav-item">F<a href="Arc.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Arc.html#svg">svg</a></li><li class="nav-heading">C<a href="Box.html">Box</a></li><li class="nav-item">F<a href="Box.html#clone">clone</a></li><li class="nav-item">F<a href="Box.html#not_intersect">not_intersect</a></li><li class="nav-item">F<a href="Box.html#intersect">intersect</a></li><li class="nav-item">F<a href="Box.html#merge">merge</a></li><li class="nav-item">F<a href="Box.html#less_than">less_than</a></li><li class="nav-item">F<a href="Box.html#equal_to">equal_to</a></li><li class="nav-item">F<a href="Box.html#set">set</a></li><li class="nav-item">F<a href="Box.html#toPoints">toPoints</a></li><li class="nav-item">F<a href="Box.html#toSegments">toSegments</a></li><li class="nav-item">F<a href="Box.html#svg">svg</a></li><li class="nav-heading">C<a href="Circle.html">Circle</a></li><li class="nav-item">F<a href="Circle.html#clone">clone</a></li><li class="nav-item">F<a href="Circle.html#contains">contains</a></li><li class="nav-item">F<a href="Circle.html#toArc">toArc</a></li><li class="nav-item">F<a href="Circle.html#intersect">intersect</a></li><li class="nav-item">F<a href="Circle.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Circle.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Circle.html#svg">svg</a></li><li class="nav-heading">C<a href="Edge.html">Edge</a></li><li class="nav-item">F<a href="Edge.html#middle">middle</a></li><li class="nav-item">F<a href="Edge.html#contains">contains</a></li><li class="nav-item">F<a href="Edge.html#setInclusion">setInclusion</a></li><li class="nav-item">F<a href="Edge.html#setOverlap">setOverlap</a></li><li class="nav-heading">C<a href="Face.html">Face</a></li><li class="nav-item">F<a href="Face.html#append">append</a></li><li class="nav-item">F<a href="Face.html#insert">insert</a></li><li class="nav-item">F<a href="Face.html#remove">remove</a></li><li class="nav-item">F<a href="Face.html#reverse">reverse</a></li><li class="nav-item">F<a href="Face.html#setArcLength">setArcLength</a></li><li class="nav-item">F<a href="Face.html#area">area</a></li><li class="nav-item">F<a href="Face.html#signedArea">signedArea</a></li><li class="nav-item">F<a href="Face.html#orientation">orientation</a></li><li class="nav-item">F<a href="Face.html#isSimple">isSimple</a></li><li class="nav-item">F<a href="Face.html#findEdgeByPoint">findEdgeByPoint</a></li><li class="nav-item">F<a href="Face.html#toPolygon">toPolygon</a></li><li class="nav-item">F<a href="Face.html#svg">svg</a></li><li class="nav-heading">C<a href="Line.html">Line</a></li><li class="nav-item">F<a href="Line.html#clone">clone</a></li><li class="nav-item">F<a href="Line.html#parallelTo">parallelTo</a></li><li class="nav-item">F<a href="Line.html#incidentTo">incidentTo</a></li><li class="nav-item">F<a href="Line.html#contains">contains</a></li><li class="nav-item">F<a href="Line.html#coord">coord</a></li><li class="nav-item">F<a href="Line.html#intersect">intersect</a></li><li class="nav-item">F<a href="Line.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Line.html#split">split</a></li><li class="nav-item">F<a href="Line.html#sortPoints">sortPoints</a></li><li class="nav-item">F<a href="Line.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Line.html#svg">svg</a></li><li class="nav-heading">C<a href="Matrix.html">Matrix</a></li><li class="nav-item">F<a href="Matrix.html#clone">clone</a></li><li class="nav-item">F<a href="Matrix.html#transform">transform</a></li><li class="nav-item">F<a href="Matrix.html#multiply">multiply</a></li><li class="nav-item">F<a href="Matrix.html#translate">translate</a></li><li class="nav-item">F<a href="Matrix.html#rotate">rotate</a></li><li class="nav-item">F<a href="Matrix.html#scale">scale</a></li><li class="nav-item">F<a href="Matrix.html#equalTo">equalTo</a></li><li class="nav-heading">C<a href="Multiline.html">Multiline</a></li><li class="nav-item">F<a href="Multiline.html#clone">clone</a></li><li class="nav-item">F<a href="Multiline.html#addVertex">addVertex</a></li><li class="nav-item">F<a href="Multiline.html#split">split</a></li><li class="nav-item">F<a href="Multiline.html#findEdgeByPoint">findEdgeByPoint</a></li><li class="nav-item">F<a href="Multiline.html#translate">translate</a></li><li class="nav-item">F<a href="Multiline.html#rotate">rotate</a></li><li class="nav-item">F<a href="Multiline.html#transform">transform</a></li><li class="nav-item">F<a href="Multiline.html#toShapes">toShapes</a></li><li class="nav-item">F<a href="Multiline.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Multiline.html#svg">svg</a></li><li class="nav-heading">C<a href="Point.html">Point</a></li><li class="nav-item">F<a href="Point.html#clone">clone</a></li><li class="nav-item">F<a href="Point.html#equalTo">equalTo</a></li><li class="nav-item">F<a href="Point.html#lessThan">lessThan</a></li><li class="nav-item">F<a href="Point.html#rotate">rotate</a></li><li class="nav-item">F<a href="Point.html#translate">translate</a></li><li class="nav-item">F<a href="Point.html#transform">transform</a></li><li class="nav-item">F<a href="Point.html#projectionOn">projectionOn</a></li><li class="nav-item">F<a href="Point.html#leftTo">leftTo</a></li><li class="nav-item">F<a href="Point.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Point.html#on">on</a></li><li class="nav-item">F<a href="Point.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Point.html#svg">svg</a></li><li class="nav-heading">C<a href="Polygon.html">Polygon</a></li><li class="nav-item">F<a href="Polygon.html#clone">clone</a></li><li class="nav-item">F<a href="Polygon.html#isEmpty">isEmpty</a></li><li class="nav-item">F<a href="Polygon.html#isValid">isValid</a></li><li class="nav-item">F<a href="Polygon.html#area">area</a></li><li class="nav-item">F<a href="Polygon.html#addFace">addFace</a></li><li class="nav-item">F<a href="Polygon.html#deleteFace">deleteFace</a></li><li class="nav-item">F<a href="Polygon.html#removeChain">removeChain</a></li><li class="nav-item">F<a href="Polygon.html#addVertex">addVertex</a></li><li class="nav-item">F<a href="Polygon.html#cut">cut</a></li><li class="nav-item">F<a href="Polygon.html#cutFace">cutFace</a></li><li class="nav-item">F<a href="Polygon.html#findEdgeByPoint">findEdgeByPoint</a></li><li class="nav-item">F<a href="Polygon.html#splitToIslands">splitToIslands</a></li><li class="nav-item">F<a href="Polygon.html#reverse">reverse</a></li><li class="nav-item">F<a href="Polygon.html#contains">contains</a></li><li class="nav-item">F<a href="Polygon.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Polygon.html#intersect">intersect</a></li><li class="nav-item">F<a href="Polygon.html#translate">translate</a></li><li class="nav-item">F<a href="Polygon.html#rotate">rotate</a></li><li class="nav-item">F<a href="Polygon.html#transform">transform</a></li><li class="nav-item">F<a href="Polygon.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Polygon.html#toArray">toArray</a></li><li class="nav-item">F<a href="Polygon.html#svg">svg</a></li><li class="nav-heading">C<a href="Ray.html">Ray</a></li><li class="nav-item">F<a href="Ray.html#clone">clone</a></li><li class="nav-item">F<a href="Ray.html#contains">contains</a></li><li class="nav-item">F<a href="Ray.html#split">split</a></li><li class="nav-item">F<a href="Ray.html#intersect">intersect</a></li><li class="nav-item">F<a href="Ray.html#svg">svg</a></li><li class="nav-heading">C<a href="Segment.html">Segment</a></li><li class="nav-item">F<a href="Segment.html#clone">clone</a></li><li class="nav-item">F<a href="Segment.html#equalTo">equalTo</a></li><li class="nav-item">F<a href="Segment.html#contains">contains</a></li><li class="nav-item">F<a href="Segment.html#intersect">intersect</a></li><li class="nav-item">F<a href="Segment.html#distanceTo">distanceTo</a></li><li class="nav-item">F<a href="Segment.html#tangentInStart">tangentInStart</a></li><li class="nav-item">F<a href="Segment.html#tangentInEnd">tangentInEnd</a></li><li class="nav-item">F<a href="Segment.html#reverse">reverse</a></li><li class="nav-item">F<a href="Segment.html#split">split</a></li><li class="nav-item">F<a href="Segment.html#middle">middle</a></li><li class="nav-item">F<a href="Segment.html#translate">translate</a></li><li class="nav-item">F<a href="Segment.html#rotate">rotate</a></li><li class="nav-item">F<a href="Segment.html#transform">transform</a></li><li class="nav-item">F<a href="Segment.html#isZeroLength">isZeroLength</a></li><li class="nav-item">F<a href="Segment.html#sortPoints">sortPoints</a></li><li class="nav-item">F<a href="Segment.html#toJSON">toJSON</a></li><li class="nav-item">F<a href="Segment.html#svg">svg</a></li><li class="nav-heading">C<a href="Vector.html">Vector</a></li><li class="nav-item">F<a href="Vector.html#clone">clone</a></li><li class="nav-item">F<a href="Vector.html#equalTo">equalTo</a></li><li class="nav-item">F<a href="Vector.html#multiply">multiply</a></li><li class="nav-item">F<a href="Vector.html#dot">dot</a></li><li class="nav-item">F<a href="Vector.html#cross">cross</a></li><li class="nav-item">F<a href="Vector.html#normalize">normalize</a></li><li class="nav-item">F<a href="Vector.html#rotate">rotate</a></li><li class="nav-item">F<a href="Vector.html#rotate90CCW">rotate90CCW</a></li><li class="nav-item">F<a href="Vector.html#rotate90CW">rotate90CW</a></li><li class="nav-item">F<a href="Vector.html#invert">invert</a></li><li class="nav-item">F<a href="Vector.html#add">add</a></li><li class="nav-item">F<a href="Vector.html#subtract">subtract</a></li><li class="nav-item">F<a href="Vector.html#angleTo">angleTo</a></li><li class="nav-item">F<a href="Vector.html#projectionOn">projectionOn</a></li><li class="nav-item">F<a href="Vector.html#toJSON">toJSON</a></li><li class="nav-heading">C<a href="CircularLinkedList.html">CircularLinkedList</a></li><li class="nav-item">F<a href="CircularLinkedList.html#append">append</a></li><li class="nav-item">F<a href="CircularLinkedList.html#insert">insert</a></li><li class="nav-item">F<a href="CircularLinkedList.html#remove">remove</a></li><li class="nav-heading">C<a href="DE9IM.html">DE9IM</a></li><li class="nav-item">F<a href="DE9IM.html#toString">toString</a></li><li class="nav-heading">C<a href="LinkedList.html">LinkedList</a></li><li class="nav-item">F<a href="LinkedList.html#toArray">toArray</a></li><li class="nav-item">F<a href="LinkedList.html#append">append</a></li><li class="nav-item">F<a href="LinkedList.html#insert">insert</a></li><li class="nav-item">F<a href="LinkedList.html#remove">remove</a></li><li class="nav-item">F<a href="LinkedList.html#isEmpty">isEmpty</a></li><li class="nav-item">F<a href="LinkedList.html#.testInfiniteLoop">testInfiniteLoop</a></li><li class="nav-heading">C<a href="PlanarSet.html">PlanarSet</a></li><li class="nav-item">F<a href="PlanarSet.html#add">add</a></li><li class="nav-item">F<a href="PlanarSet.html#delete">delete</a></li><li class="nav-item">F<a href="PlanarSet.html#clear">clear</a></li><li class="nav-item">F<a href="PlanarSet.html#search">search</a></li><li class="nav-item">F<a href="PlanarSet.html#hit">hit</a></li><li class="nav-item">F<a href="PlanarSet.html#svg">svg</a></li><li class="nav-heading">C<a href="Errors.html">Errors</a></li><li class="nav-heading">Modules</li><li class="nav-heading">M<a href="module-BooleanOperations.html">BooleanOperations</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.unify">unify</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.subtract">subtract</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.intersect">intersect</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.innerClip">innerClip</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.outerClip">outerClip</a></li><li class="nav-item">F<a href="module-BooleanOperations.html#.calculateIntersections">calculateIntersections</a></li><li class="nav-heading">M<a href="module-RayShoot.html">RayShoot</a></li><li class="nav-item">F<a href="module-RayShoot.html#.ray_shoot">ray_shoot</a></li><li class="nav-heading">M<a href="module-Relation.html">Relation</a></li><li class="nav-item">F<a href="module-Relation.html#.equal">equal</a></li><li class="nav-item">F<a href="module-Relation.html#.intersect">intersect</a></li><li class="nav-item">F<a href="module-Relation.html#.touch">touch</a></li><li class="nav-item">F<a href="module-Relation.html#.disjoint">disjoint</a></li><li class="nav-item">F<a href="module-Relation.html#.inside">inside</a></li><li class="nav-item">F<a href="module-Relation.html#.covered">covered</a></li><li class="nav-item">F<a href="module-Relation.html#.contain">contain</a></li><li class="nav-item">F<a href="module-Relation.html#.cover">cover</a></li><li class="nav-item">F<a href="module-Relation.html#.relate">relate</a></li><li class="nav-heading"><a href="global.html">Globals</a></li><li class="nav-item">F<a href="global.html#inverse">inverse</a></li><li class="nav-item">M<a href="global.html#arc">arc</a></li><li class="nav-item">M<a href="global.html#box">box</a></li><li class="nav-item">M<a href="global.html#circle">circle</a></li><li class="nav-item">M<a href="global.html#line">line</a></li><li class="nav-item">M<a href="global.html#matrix">matrix</a></li><li class="nav-item">M<a href="global.html#multiline">multiline</a></li><li class="nav-item">M<a href="global.html#point">point</a></li><li class="nav-item">M<a href="global.html#polygon">polygon</a></li><li class="nav-item">M<a href="global.html#segment">segment</a></li><li class="nav-item">M<a href="global.html#vector">vector</a></li><li class="nav-item">M<a href="global.html#CCW">CCW</a></li><li class="nav-item">M<a href="global.html#CW">CW</a></li><li class="nav-item">M<a href="global.html#ORIENTATION">ORIENTATION</a></li><li class="nav-item">M<a href="global.html#DP_TOL">DP_TOL</a></li><li class="nav-item">F<a href="global.html#setTolerance">setTolerance</a></li><li class="nav-item">F<a href="global.html#getTolerance">getTolerance</a></li><li class="nav-item">F<a href="global.html#EQ_0">EQ_0</a></li><li class="nav-item">F<a href="global.html#EQ">EQ</a></li><li class="nav-item">F<a href="global.html#GT">GT</a></li><li class="nav-item">F<a href="global.html#GE">GE</a></li><li class="nav-item">F<a href="global.html#LT">LT</a></li><li class="nav-item">F<a href="global.html#LE">LE</a></li> </nav> <div id="main"> <h1 class="page-title">classes/multiline.js</h1> <section> <article> <pre class="prettyprint source linenums"><code>"use strict"; import Flatten from '../flatten'; import LinkedList from '../data_structures/linked_list'; /** * Class Multiline represent connected path of [edges]{@link Flatten.Edge}, where each edge may be * [segment]{@link Flatten.Segment}, [arc]{@link Flatten.Arc}, [line]{@link Flatten.Line} or [ray]{@link Flatten.Ray} */ export class Multiline extends LinkedList { constructor(...args) { super(); if (args.length === 0) { return; } if (args.length == 1) { if (args[0] instanceof Array) { let shapes = args[0]; if (shapes.length == 0) return; // TODO: more strict validation: // there may be only one line // only first and last may be rays let validShapes = shapes.every((shape) => { return shape instanceof Flatten.Segment || shape instanceof Flatten.Arc || shape instanceof Flatten.Ray || shape instanceof Flatten.Line }); for (let shape of shapes) { let edge = new Flatten.Edge(shape); this.append(edge); } } } } /** * (Getter) Return array of edges * @returns {Edge[]} */ get edges() { return [...this]; } /** * (Getter) Return bounding box of the multiline * @returns {Box} */ get box() { return this.edges.reduce( (acc,edge) => acc = acc.merge(edge.box), new Flatten.Box() ); } /** * (Getter) Returns array of vertices * @returns {Point[]} */ get vertices() { let v = this.edges.map(edge => edge.start); v.push(this.last.end); return v; } /** * Return new cloned instance of Multiline * @returns {Multiline} */ clone() { return new Multiline(this.toShapes()); } /** * Split edge and add new vertex, return new edge inserted * @param {Point} pt - point on edge that will be added as new vertex * @param {Edge} edge - edge to split * @returns {Edge} */ addVertex(pt, edge) { let shapes = edge.shape.split(pt); // if (shapes.length < 2) return; if (shapes[0] === null) // point incident to edge start vertex, return previous edge return edge.prev; if (shapes[1] === null) // point incident to edge end vertex, return edge itself return edge; let newEdge = new Flatten.Edge(shapes[0]); let edgeBefore = edge.prev; /* Insert first split edge into linked list after edgeBefore */ this.insert(newEdge, edgeBefore); // edge.face ? // Update edge shape with second split edge keeping links edge.shape = shapes[1]; return newEdge; } /** * Split edges of multiline with intersection points and return mutated multiline * @param {Point[]} ip - array of points to be added as new vertices * @returns {Multiline} */ split(ip) { for (let pt of ip) { let edge = this.findEdgeByPoint(pt); this.addVertex(pt, edge); } return this; } /** * Returns edge which contains given point * @param {Point} pt * @returns {Edge} */ findEdgeByPoint(pt) { let edgeFound; for (let edge of this) { if (edge.shape.contains(pt)) { edgeFound = edge; break; } } return edgeFound; } /** * Returns new multiline translated by vector vec * @param {Vector} vec * @returns {Multiline} */ translate(vec) { return new Multiline(this.edges.map( edge => edge.shape.translate(vec))); } /** * Return new multiline rotated by given angle around given point * If point omitted, rotate around origin (0,0) * Positive value of angle defines rotation counter clockwise, negative - clockwise * @param {number} angle - rotation angle in radians * @param {Point} center - rotation center, default is (0,0) * @returns {Multiline} - new rotated polygon */ rotate(angle = 0, center = new Flatten.Point()) { return new Multiline(this.edges.map( edge => edge.shape.rotate(angle, center) )); } /** * Return new multiline transformed using affine transformation matrix * Method does not support unbounded shapes * @param {Matrix} matrix - affine transformation matrix * @returns {Multiline} - new multiline */ transform(matrix = new Flatten.Matrix()) { return new Multiline(this.edges.map( edge => edge.shape.transform(matrix))); } /** * Transform multiline into array of shapes * @returns {Shape[]} */ toShapes() { return this.edges.map(edge => edge.shape.clone()) } /** * This method returns an object that defines how data will be * serialized when called JSON.stringify() method * @returns {Object} */ toJSON() { return this.edges.map(edge => edge.toJSON()); } /** * Return string to draw multiline in svg * @param attrs - an object with attributes for svg path element, * like "stroke", "strokeWidth", "fill", "fillRule", "fillOpacity" * Defaults are stroke:"black", strokeWidth:"1", fill:"lightcyan", fillRule:"evenodd", fillOpacity: "1" * TODO: support infinite Ray and Line * @returns {string} */ svg(attrs = {}) { let {stroke, strokeWidth, fill, fillRule, fillOpacity, id, className} = attrs; let id_str = (id && id.length > 0) ? `id="${id}"` : ""; let class_str = (className && className.length > 0) ? `class="${className}"` : ""; let svgStr = `\n<path stroke="${stroke || "black"}" stroke-width="${strokeWidth || 1}" fill="${fill || "lightcyan"}" fill-rule="${fillRule || "evenodd"}" fill-opacity="${fillOpacity || 1.0}" ${id_str} ${class_str} d="`; svgStr += `\nM${this.first.start.x},${this.first.start.y}`; for (let edge of this) { svgStr += edge.svg(); } svgStr += ` z`; svgStr += `" >\n</path>`; return svgStr; } } Flatten.Multiline = Multiline; /** * Shortcut function to create multiline * @param args */ export const multiline = (...args) => new Flatten.Multiline(...args); Flatten.multiline = multiline; </code></pre> </article> </section> </div> <footer> Generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.3</a> on Sun May 16 2021 15:05:05 GMT+0300 (Israel Daylight Time) using the Minami theme. </footer> <script>prettyPrint();</script> <script src="scripts/linenumber.js"></script> </body> </html>