UNPKG

roughjs-es5

Version:

Create graphics using HTML Canvas or SVG with a hand-drawn, sketchy, appearance.

720 lines (707 loc) 29.1 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.RoughRenderer = undefined; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _hachure = require("./hachure.js"); var _segment = require("./segment.js"); var _path = require("./path.js"); function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var RoughRenderer = exports.RoughRenderer = function () { function RoughRenderer() { _classCallCheck(this, RoughRenderer); } _createClass(RoughRenderer, [{ key: "line", value: function line(x1, y1, x2, y2, o) { var ops = this._doubleLine(x1, y1, x2, y2, o); return { type: "path", ops: ops }; } }, { key: "linearPath", value: function linearPath(points, close, o) { var len = (points || []).length; if (len > 2) { var ops = []; for (var i = 0; i < len - 1; i++) { ops = ops.concat(this._doubleLine(points[i][0], points[i][1], points[i + 1][0], points[i + 1][1], o)); } if (close) { ops = ops.concat(this._doubleLine(points[len - 1][0], points[len - 1][1], points[0][0], points[0][1], o)); } return { type: "path", ops: ops }; } else if (len === 2) { return this.line(points[0][0], points[0][1], points[1][0], points[1][1], o); } } }, { key: "polygon", value: function polygon(points, o) { return this.linearPath(points, true, o); } }, { key: "rectangle", value: function rectangle(x, y, width, height, o) { var points = [[x, y], [x + width, y], [x + width, y + height], [x, y + height]]; return this.polygon(points, o); } }, { key: "curve", value: function curve(points, o) { var o1 = this._curveWithOffset(points, 1 * (1 + o.roughness * 0.2), o); var o2 = this._curveWithOffset(points, 1.5 * (1 + o.roughness * 0.22), o); return { type: "path", ops: o1.concat(o2) }; } }, { key: "ellipse", value: function ellipse(x, y, width, height, o) { var increment = Math.PI * 2 / o.curveStepCount; var rx = Math.abs(width / 2); var ry = Math.abs(height / 2); rx += this._getOffset(-rx * 0.05, rx * 0.05, o); ry += this._getOffset(-ry * 0.05, ry * 0.05, o); var o1 = this._ellipse(increment, x, y, rx, ry, 1, increment * this._getOffset(0.1, this._getOffset(0.4, 1, o), o), o); var o2 = this._ellipse(increment, x, y, rx, ry, 1.5, 0, o); return { type: "path", ops: o1.concat(o2) }; } }, { key: "arc", value: function arc(x, y, width, height, start, stop, closed, roughClosure, o) { var cx = x; var cy = y; var rx = Math.abs(width / 2); var ry = Math.abs(height / 2); rx += this._getOffset(-rx * 0.01, rx * 0.01, o); ry += this._getOffset(-ry * 0.01, ry * 0.01, o); var strt = start; var stp = stop; while (strt < 0) { strt += Math.PI * 2; stp += Math.PI * 2; } if (stp - strt > Math.PI * 2) { strt = 0; stp = Math.PI * 2; } var ellipseInc = Math.PI * 2 / o.curveStepCount; var arcInc = Math.min(ellipseInc / 2, (stp - strt) / 2); var o1 = this._arc(arcInc, cx, cy, rx, ry, strt, stp, 1, o); var o2 = this._arc(arcInc, cx, cy, rx, ry, strt, stp, 1.5, o); var ops = o1.concat(o2); if (closed) { if (roughClosure) { ops = ops.concat(this._doubleLine(cx, cy, cx + rx * Math.cos(strt), cy + ry * Math.sin(strt), o)); ops = ops.concat(this._doubleLine(cx, cy, cx + rx * Math.cos(stp), cy + ry * Math.sin(stp), o)); } else { ops.push({ op: "lineTo", data: [cx, cy] }); ops.push({ op: "lineTo", data: [cx + rx * Math.cos(strt), cy + ry * Math.sin(strt)] }); } } return { type: "path", ops: ops }; } }, { key: "hachureFillArc", value: function hachureFillArc(x, y, width, height, start, stop, o) { var cx = x; var cy = y; var rx = Math.abs(width / 2); var ry = Math.abs(height / 2); rx += this._getOffset(-rx * 0.01, rx * 0.01, o); ry += this._getOffset(-ry * 0.01, ry * 0.01, o); var strt = start; var stp = stop; while (strt < 0) { strt += Math.PI * 2; stp += Math.PI * 2; } if (stp - strt > Math.PI * 2) { strt = 0; stp = Math.PI * 2; } var increment = (stp - strt) / o.curveStepCount; var offset = 1; var xc = [], yc = []; for (var angle = strt; angle <= stp; angle = angle + increment) { xc.push(cx + rx * Math.cos(angle)); yc.push(cy + ry * Math.sin(angle)); } xc.push(cx + rx * Math.cos(stp)); yc.push(cy + ry * Math.sin(stp)); xc.push(cx); yc.push(cy); return this.hachureFillShape(xc, yc, o); } }, { key: "solidFillShape", value: function solidFillShape(xCoords, yCoords, o) { var ops = []; if (xCoords && yCoords && xCoords.length && yCoords.length && xCoords.length === yCoords.length) { var offset = o.maxRandomnessOffset || 0; var len = xCoords.length; if (len > 2) { ops.push({ op: "move", data: [xCoords[0] + this._getOffset(-offset, offset, o), yCoords[0] + this._getOffset(-offset, offset, o)] }); for (var i = 1; i < len; i++) { ops.push({ op: "lineTo", data: [xCoords[i] + this._getOffset(-offset, offset, o), yCoords[i] + this._getOffset(-offset, offset, o)] }); } } } return { type: "fillPath", ops: ops }; } }, { key: "hachureFillShape", value: function hachureFillShape(xCoords, yCoords, o) { var ops = []; if (xCoords && yCoords && xCoords.length && yCoords.length) { var left = xCoords[0]; var right = xCoords[0]; var top = yCoords[0]; var bottom = yCoords[0]; for (var i = 1; i < xCoords.length; i++) { left = Math.min(left, xCoords[i]); right = Math.max(right, xCoords[i]); top = Math.min(top, yCoords[i]); bottom = Math.max(bottom, yCoords[i]); } var angle = o.hachureAngle; var gap = o.hachureGap; if (gap < 0) { gap = o.strokeWidth * 4; } gap = Math.max(gap, 0.1); var radPerDeg = Math.PI / 180; var hachureAngle = angle % 180 * radPerDeg; var cosAngle = Math.cos(hachureAngle); var sinAngle = Math.sin(hachureAngle); var tanAngle = Math.tan(hachureAngle); var it = new _hachure.RoughHachureIterator(top - 1, bottom + 1, left - 1, right + 1, gap, sinAngle, cosAngle, tanAngle); var rectCoords = void 0; while ((rectCoords = it.getNextLine()) != null) { var lines = this._getIntersectingLines(rectCoords, xCoords, yCoords); for (var _i = 0; _i < lines.length; _i++) { if (_i < lines.length - 1) { var p1 = lines[_i]; var p2 = lines[_i + 1]; ops = ops.concat(this._doubleLine(p1[0], p1[1], p2[0], p2[1], o)); } } } } return { type: "fillSketch", ops: ops }; } }, { key: "hachureFillEllipse", value: function hachureFillEllipse(cx, cy, width, height, o) { var ops = []; var rx = Math.abs(width / 2); var ry = Math.abs(height / 2); rx += this._getOffset(-rx * 0.05, rx * 0.05, o); ry += this._getOffset(-ry * 0.05, ry * 0.05, o); var angle = o.hachureAngle; var gap = o.hachureGap; if (gap <= 0) { gap = o.strokeWidth * 4; } var fweight = o.fillWeight; if (fweight < 0) { fweight = o.strokeWidth / 2; } var radPerDeg = Math.PI / 180; var hachureAngle = angle % 180 * radPerDeg; var tanAngle = Math.tan(hachureAngle); var aspectRatio = ry / rx; var hyp = Math.sqrt(aspectRatio * tanAngle * aspectRatio * tanAngle + 1); var sinAnglePrime = aspectRatio * tanAngle / hyp; var cosAnglePrime = 1 / hyp; var gapPrime = gap / (rx * ry / Math.sqrt(ry * cosAnglePrime * (ry * cosAnglePrime) + rx * sinAnglePrime * (rx * sinAnglePrime)) / rx); var halfLen = Math.sqrt(rx * rx - (cx - rx + gapPrime) * (cx - rx + gapPrime)); for (var xPos = cx - rx + gapPrime; xPos < cx + rx; xPos += gapPrime) { halfLen = Math.sqrt(rx * rx - (cx - xPos) * (cx - xPos)); var p1 = this._affine(xPos, cy - halfLen, cx, cy, sinAnglePrime, cosAnglePrime, aspectRatio); var p2 = this._affine(xPos, cy + halfLen, cx, cy, sinAnglePrime, cosAnglePrime, aspectRatio); ops = ops.concat(this._doubleLine(p1[0], p1[1], p2[0], p2[1], o)); } return { type: "fillSketch", ops: ops }; } }, { key: "svgPath", value: function svgPath(path, o) { path = (path || "").replace(/\n/g, " ").replace(/(-\s)/g, "-").replace("/(ss)/g", " "); var p = new _path.RoughPath(path); if (o.simplification) { var fitter = new _path.PathFitter(p.linearPoints, p.closed); var d = fitter.fit(o.simplification); p = new _path.RoughPath(d); } var ops = []; var segments = p.segments || []; for (var i = 0; i < segments.length; i++) { var s = segments[i]; var prev = i > 0 ? segments[i - 1] : null; var opList = this._processSegment(p, s, prev, o); if (opList && opList.length) { ops = ops.concat(opList); } } return { type: "path", ops: ops }; } // privates }, { key: "_bezierTo", value: function _bezierTo(x1, y1, x2, y2, x, y, path, o) { var ops = []; var ros = [o.maxRandomnessOffset || 1, (o.maxRandomnessOffset || 1) + 0.5]; var f = null; for (var i = 0; i < 2; i++) { if (i === 0) { ops.push({ op: "move", data: [path.x, path.y] }); } else { ops.push({ op: "move", data: [path.x + this._getOffset(-ros[0], ros[0], o), path.y + this._getOffset(-ros[0], ros[0], o)] }); } f = [x + this._getOffset(-ros[i], ros[i], o), y + this._getOffset(-ros[i], ros[i], o)]; ops.push({ op: "bcurveTo", data: [x1 + this._getOffset(-ros[i], ros[i], o), y1 + this._getOffset(-ros[i], ros[i], o), x2 + this._getOffset(-ros[i], ros[i], o), y2 + this._getOffset(-ros[i], ros[i], o), f[0], f[1]] }); } path.setPosition(f[0], f[1]); return ops; } }, { key: "_processSegment", value: function _processSegment(path, seg, prevSeg, o) { var ops = []; switch (seg.key) { case "M": case "m": { var delta = seg.key === "m"; if (seg.data.length >= 2) { var x = +seg.data[0]; var y = +seg.data[1]; if (delta) { x += path.x; y += path.y; } var ro = 1 * (o.maxRandomnessOffset || 0); x = x + this._getOffset(-ro, ro, o); y = y + this._getOffset(-ro, ro, o); path.setPosition(x, y); ops.push({ op: "move", data: [x, y] }); } break; } case "L": case "l": { var _delta = seg.key === "l"; if (seg.data.length >= 2) { var _x = +seg.data[0]; var _y = +seg.data[1]; if (_delta) { _x += path.x; _y += path.y; } ops = ops.concat(this._doubleLine(path.x, path.y, _x, _y, o)); path.setPosition(_x, _y); } break; } case "H": case "h": { var _delta2 = seg.key === "h"; if (seg.data.length) { var _x2 = +seg.data[0]; if (_delta2) { _x2 += path.x; } ops = ops.concat(this._doubleLine(path.x, path.y, _x2, path.y, o)); path.setPosition(_x2, path.y); } break; } case "V": case "v": { var _delta3 = seg.key === "v"; if (seg.data.length) { var _y2 = +seg.data[0]; if (_delta3) { _y2 += path.y; } ops = ops.concat(this._doubleLine(path.x, path.y, path.x, _y2, o)); path.setPosition(path.x, _y2); } break; } case "Z": case "z": { if (path.first) { ops = ops.concat(this._doubleLine(path.x, path.y, path.first[0], path.first[1], o)); path.setPosition(path.first[0], path.first[1]); path.first = null; } break; } case "C": case "c": { var _delta4 = seg.key === "c"; if (seg.data.length >= 6) { var x1 = +seg.data[0]; var y1 = +seg.data[1]; var x2 = +seg.data[2]; var y2 = +seg.data[3]; var _x3 = +seg.data[4]; var _y3 = +seg.data[5]; if (_delta4) { x1 += path.x; x2 += path.x; _x3 += path.x; y1 += path.y; y2 += path.y; _y3 += path.y; } var ob = this._bezierTo(x1, y1, x2, y2, _x3, _y3, path, o); ops = ops.concat(ob); path.bezierReflectionPoint = [_x3 + (_x3 - x2), _y3 + (_y3 - y2)]; } break; } case "S": case "s": { var _delta5 = seg.key === "s"; if (seg.data.length >= 4) { var _x4 = +seg.data[0]; var _y4 = +seg.data[1]; var _x5 = +seg.data[2]; var _y5 = +seg.data[3]; if (_delta5) { _x4 += path.x; _x5 += path.x; _y4 += path.y; _y5 += path.y; } var _x6 = _x4; var _y6 = _y4; var prevKey = prevSeg ? prevSeg.key : ""; var ref = null; if (prevKey == "c" || prevKey == "C" || prevKey == "s" || prevKey == "S") { ref = path.bezierReflectionPoint; } if (ref) { _x6 = ref[0]; _y6 = ref[1]; } var _ob = this._bezierTo(_x6, _y6, _x4, _y4, _x5, _y5, path, o); ops = ops.concat(_ob); path.bezierReflectionPoint = [_x5 + (_x5 - _x4), _y5 + (_y5 - _y4)]; } break; } case "Q": case "q": { var _delta6 = seg.key === "q"; if (seg.data.length >= 4) { var _x7 = +seg.data[0]; var _y7 = +seg.data[1]; var _x8 = +seg.data[2]; var _y8 = +seg.data[3]; if (_delta6) { _x7 += path.x; _x8 += path.x; _y7 += path.y; _y8 += path.y; } var offset1 = 1 * (1 + o.roughness * 0.2); var offset2 = 1.5 * (1 + o.roughness * 0.22); ops.push({ op: "move", data: [path.x + this._getOffset(-offset1, offset1, o), path.y + this._getOffset(-offset1, offset1, o)] }); var f = [_x8 + this._getOffset(-offset1, offset1, o), _y8 + this._getOffset(-offset1, offset1, o)]; ops.push({ op: "qcurveTo", data: [_x7 + this._getOffset(-offset1, offset1, o), _y7 + this._getOffset(-offset1, offset1, o), f[0], f[1]] }); ops.push({ op: "move", data: [path.x + this._getOffset(-offset2, offset2, o), path.y + this._getOffset(-offset2, offset2, o)] }); f = [_x8 + this._getOffset(-offset2, offset2, o), _y8 + this._getOffset(-offset2, offset2, o)]; ops.push({ op: "qcurveTo", data: [_x7 + this._getOffset(-offset2, offset2, o), _y7 + this._getOffset(-offset2, offset2, o), f[0], f[1]] }); path.setPosition(f[0], f[1]); path.quadReflectionPoint = [_x8 + (_x8 - _x7), _y8 + (_y8 - _y7)]; } break; } case "T": case "t": { var _delta7 = seg.key === "t"; if (seg.data.length >= 2) { var _x9 = +seg.data[0]; var _y9 = +seg.data[1]; if (_delta7) { _x9 += path.x; _y9 += path.y; } var _x10 = _x9; var _y10 = _y9; var _prevKey = prevSeg ? prevSeg.key : ""; var ref = null; if (_prevKey == "q" || _prevKey == "Q" || _prevKey == "t" || _prevKey == "T") { ref = path.quadReflectionPoint; } if (ref) { _x10 = ref[0]; _y10 = ref[1]; } var _offset = 1 * (1 + o.roughness * 0.2); var _offset2 = 1.5 * (1 + o.roughness * 0.22); ops.push({ op: "move", data: [path.x + this._getOffset(-_offset, _offset, o), path.y + this._getOffset(-_offset, _offset, o)] }); var _f = [_x9 + this._getOffset(-_offset, _offset, o), _y9 + this._getOffset(-_offset, _offset, o)]; ops.push({ op: "qcurveTo", data: [_x10 + this._getOffset(-_offset, _offset, o), _y10 + this._getOffset(-_offset, _offset, o), _f[0], _f[1]] }); ops.push({ op: "move", data: [path.x + this._getOffset(-_offset2, _offset2, o), path.y + this._getOffset(-_offset2, _offset2, o)] }); _f = [_x9 + this._getOffset(-_offset2, _offset2, o), _y9 + this._getOffset(-_offset2, _offset2, o)]; ops.push({ op: "qcurveTo", data: [_x10 + this._getOffset(-_offset2, _offset2, o), _y10 + this._getOffset(-_offset2, _offset2, o), _f[0], _f[1]] }); path.setPosition(_f[0], _f[1]); path.quadReflectionPoint = [_x9 + (_x9 - _x10), _y9 + (_y9 - _y10)]; } break; } case "A": case "a": { var _delta8 = seg.key === "a"; if (seg.data.length >= 7) { var rx = +seg.data[0]; var ry = +seg.data[1]; var angle = +seg.data[2]; var largeArcFlag = +seg.data[3]; var sweepFlag = +seg.data[4]; var _x11 = +seg.data[5]; var _y11 = +seg.data[6]; if (_delta8) { _x11 += path.x; _y11 += path.y; } if (_x11 == path.x && _y11 == path.y) { break; } if (rx == 0 || ry == 0) { ops = ops.concat(this._doubleLine(path.x, path.y, _x11, _y11, o)); path.setPosition(_x11, _y11); } else { var final = null; var _ro = o.maxRandomnessOffset || 0; for (var i = 0; i < 1; i++) { var arcConverter = new _path.RoughArcConverter([path.x, path.y], [_x11, _y11], [rx, ry], angle, largeArcFlag ? true : false, sweepFlag ? true : false); var segment = arcConverter.getNextSegment(); while (segment) { var _ob2 = this._bezierTo(segment.cp1[0], segment.cp1[1], segment.cp2[0], segment.cp2[1], segment.to[0], segment.to[1], path, o); ops = ops.concat(_ob2); segment = arcConverter.getNextSegment(); } } } } break; } default: break; } return ops; } }, { key: "_getOffset", value: function _getOffset(min, max, ops) { return ops.roughness * (Math.random() * (max - min) + min); } }, { key: "_affine", value: function _affine(x, y, cx, cy, sinAnglePrime, cosAnglePrime, R) { var A = -cx * cosAnglePrime - cy * sinAnglePrime + cx; var B = R * (cx * sinAnglePrime - cy * cosAnglePrime) + cy; var C = cosAnglePrime; var D = sinAnglePrime; var E = -R * sinAnglePrime; var F = R * cosAnglePrime; return [A + C * x + D * y, B + E * x + F * y]; } }, { key: "_doubleLine", value: function _doubleLine(x1, y1, x2, y2, o) { var o1 = this._line(x1, y1, x2, y2, o, true, false); var o2 = this._line(x1, y1, x2, y2, o, true, true); return o1.concat(o2); } }, { key: "_line", value: function _line(x1, y1, x2, y2, o, move, overlay) { var lengthSq = Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2); var offset = o.maxRandomnessOffset || 0; if (offset * offset * 100 > lengthSq) { offset = Math.sqrt(lengthSq) / 10; } var halfOffset = offset / 2; var divergePoint = 0.2 + Math.random() * 0.2; var midDispX = o.bowing * o.maxRandomnessOffset * (y2 - y1) / 200; var midDispY = o.bowing * o.maxRandomnessOffset * (x1 - x2) / 200; midDispX = this._getOffset(-midDispX, midDispX, o); midDispY = this._getOffset(-midDispY, midDispY, o); var ops = []; if (move) { if (overlay) { ops.push({ op: "move", data: [x1 + this._getOffset(-halfOffset, halfOffset, o), y1 + this._getOffset(-halfOffset, halfOffset, o)] }); } else { ops.push({ op: "move", data: [x1 + this._getOffset(-offset, offset, o), y1 + this._getOffset(-offset, offset, o)] }); } } if (overlay) { ops.push({ op: "bcurveTo", data: [midDispX + x1 + (x2 - x1) * divergePoint + this._getOffset(-halfOffset, halfOffset, o), midDispY + y1 + (y2 - y1) * divergePoint + this._getOffset(-halfOffset, halfOffset, o), midDispX + x1 + 2 * (x2 - x1) * divergePoint + this._getOffset(-halfOffset, halfOffset, o), midDispY + y1 + 2 * (y2 - y1) * divergePoint + this._getOffset(-halfOffset, halfOffset, o), x2 + this._getOffset(-halfOffset, halfOffset, o), y2 + this._getOffset(-halfOffset, halfOffset, o)] }); } else { ops.push({ op: "bcurveTo", data: [midDispX + x1 + (x2 - x1) * divergePoint + this._getOffset(-offset, offset, o), midDispY + y1 + (y2 - y1) * divergePoint + this._getOffset(-offset, offset, o), midDispX + x1 + 2 * (x2 - x1) * divergePoint + this._getOffset(-offset, offset, o), midDispY + y1 + 2 * (y2 - y1) * divergePoint + this._getOffset(-offset, offset, o), x2 + this._getOffset(-offset, offset, o), y2 + this._getOffset(-offset, offset, o)] }); } return ops; } }, { key: "_curve", value: function _curve(points, closePoint, o) { var len = points.length; var ops = []; if (len > 3) { var b = []; var s = 1 - o.curveTightness; ops.push({ op: "move", data: [points[1][0], points[1][1]] }); for (var i = 1; i + 2 < len; i++) { var cachedVertArray = points[i]; b[0] = [cachedVertArray[0], cachedVertArray[1]]; b[1] = [cachedVertArray[0] + (s * points[i + 1][0] - s * points[i - 1][0]) / 6, cachedVertArray[1] + (s * points[i + 1][1] - s * points[i - 1][1]) / 6]; b[2] = [points[i + 1][0] + (s * points[i][0] - s * points[i + 2][0]) / 6, points[i + 1][1] + (s * points[i][1] - s * points[i + 2][1]) / 6]; b[3] = [points[i + 1][0], points[i + 1][1]]; ops.push({ op: "bcurveTo", data: [b[1][0], b[1][1], b[2][0], b[2][1], b[3][0], b[3][1]] }); } if (closePoint && closePoint.length === 2) { var ro = o.maxRandomnessOffset; // TODO: more roughness here? ops.push({ ops: "lineTo", data: [closePoint[0] + this._getOffset(-ro, ro, o), closePoint[1] + +this._getOffset(-ro, ro, o)] }); } } else if (len === 3) { ops.push({ op: "move", data: [points[1][0], points[1][1]] }); ops.push({ op: "bcurveTo", data: [points[1][0], points[1][1], points[2][0], points[2][1], points[2][0], points[2][1]] }); } else if (len === 2) { ops = ops.concat(this._doubleLine(points[0][0], points[0][1], points[1][0], points[1][1], o)); } return ops; } }, { key: "_ellipse", value: function _ellipse(increment, cx, cy, rx, ry, offset, overlap, o) { var radOffset = this._getOffset(-0.5, 0.5, o) - Math.PI / 2; var points = []; points.push([this._getOffset(-offset, offset, o) + cx + 0.9 * rx * Math.cos(radOffset - increment), this._getOffset(-offset, offset, o) + cy + 0.9 * ry * Math.sin(radOffset - increment)]); for (var angle = radOffset; angle < Math.PI * 2 + radOffset - 0.01; angle = angle + increment) { points.push([this._getOffset(-offset, offset, o) + cx + rx * Math.cos(angle), this._getOffset(-offset, offset, o) + cy + ry * Math.sin(angle)]); } points.push([this._getOffset(-offset, offset, o) + cx + rx * Math.cos(radOffset + Math.PI * 2 + overlap * 0.5), this._getOffset(-offset, offset, o) + cy + ry * Math.sin(radOffset + Math.PI * 2 + overlap * 0.5)]); points.push([this._getOffset(-offset, offset, o) + cx + 0.98 * rx * Math.cos(radOffset + overlap), this._getOffset(-offset, offset, o) + cy + 0.98 * ry * Math.sin(radOffset + overlap)]); points.push([this._getOffset(-offset, offset, o) + cx + 0.9 * rx * Math.cos(radOffset + overlap * 0.5), this._getOffset(-offset, offset, o) + cy + 0.9 * ry * Math.sin(radOffset + overlap * 0.5)]); return this._curve(points, null, o); } }, { key: "_curveWithOffset", value: function _curveWithOffset(points, offset, o) { var ps = []; ps.push([points[0][0] + this._getOffset(-offset, offset, o), points[0][1] + this._getOffset(-offset, offset, o)]); ps.push([points[0][0] + this._getOffset(-offset, offset, o), points[0][1] + this._getOffset(-offset, offset, o)]); for (var i = 1; i < points.length; i++) { ps.push([points[i][0] + this._getOffset(-offset, offset, o), points[i][1] + this._getOffset(-offset, offset, o)]); if (i === points.length - 1) { ps.push([points[i][0] + this._getOffset(-offset, offset, o), points[i][1] + this._getOffset(-offset, offset, o)]); } } return this._curve(ps, null, o); } }, { key: "_arc", value: function _arc(increment, cx, cy, rx, ry, strt, stp, offset, o) { var radOffset = strt + this._getOffset(-0.1, 0.1, o); var points = []; points.push([this._getOffset(-offset, offset, o) + cx + 0.9 * rx * Math.cos(radOffset - increment), this._getOffset(-offset, offset, o) + cy + 0.9 * ry * Math.sin(radOffset - increment)]); for (var angle = radOffset; angle <= stp; angle = angle + increment) { points.push([this._getOffset(-offset, offset, o) + cx + rx * Math.cos(angle), this._getOffset(-offset, offset, o) + cy + ry * Math.sin(angle)]); } points.push([cx + rx * Math.cos(stp), cy + ry * Math.sin(stp)]); points.push([cx + rx * Math.cos(stp), cy + ry * Math.sin(stp)]); return this._curve(points, null, o); } }, { key: "_getIntersectingLines", value: function _getIntersectingLines(lineCoords, xCoords, yCoords) { var intersections = []; var s1 = new _segment.RoughSegment(lineCoords[0], lineCoords[1], lineCoords[2], lineCoords[3]); for (var i = 0; i < xCoords.length; i++) { var s2 = new _segment.RoughSegment(xCoords[i], yCoords[i], xCoords[(i + 1) % xCoords.length], yCoords[(i + 1) % xCoords.length]); if (s1.compare(s2) == (0, _segment.RoughSegmentRelation)().INTERSECTS) { intersections.push([s1.xi, s1.yi]); } } return intersections; } }]); return RoughRenderer; }();