@realsee/dnalogel 2.0.0-alpha.52 → 2.0.0-alpha.53

package/dist/index.js

@@ -15,7 +15,6 @@ var FBXLoader = require('three/examples/jsm/loaders/FBXLoader');
 var TWEEN = require('@tweenjs/tween.js');
 var Hammer = require('hammerjs');
 var classNames = require('classnames');
-var getNormals = require('polyline-normals');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -42,7 +41,6 @@ var TWEEN__namespace = /*#__PURE__*/_interopNamespace(TWEEN);
 var TWEEN__default = /*#__PURE__*/_interopDefaultLegacy(TWEEN);
 var Hammer__default = /*#__PURE__*/_interopDefaultLegacy(Hammer);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
-var getNormals__default = /*#__PURE__*/_interopDefaultLegacy(getNormals);
 
 /**
  * Five 模型插件
@@ -18116,6 +18114,193 @@ const PanoDoorLabelPlugin = (five) => {
     return new PanoDoorLabelPluginController(five);
 };
 
+var polylineMiterUtil = {};
+
+var add_1 = add$1;
+
+/**
+ * Adds two vec2's
+ *
+ * @param {vec2} out the receiving vector
+ * @param {vec2} a the first operand
+ * @param {vec2} b the second operand
+ * @returns {vec2} out
+ */
+function add$1(out, a, b) {
+    out[0] = a[0] + b[0];
+    out[1] = a[1] + b[1];
+    return out
+}
+
+var set_1 = set$1;
+
+/**
+ * Set the components of a vec2 to the given values
+ *
+ * @param {vec2} out the receiving vector
+ * @param {Number} x X component
+ * @param {Number} y Y component
+ * @returns {vec2} out
+ */
+function set$1(out, x, y) {
+    out[0] = x;
+    out[1] = y;
+    return out
+}
+
+var normalize_1 = normalize$1;
+
+/**
+ * Normalize a vec2
+ *
+ * @param {vec2} out the receiving vector
+ * @param {vec2} a vector to normalize
+ * @returns {vec2} out
+ */
+function normalize$1(out, a) {
+    var x = a[0],
+        y = a[1];
+    var len = x*x + y*y;
+    if (len > 0) {
+        //TODO: evaluate use of glm_invsqrt here?
+        len = 1 / Math.sqrt(len);
+        out[0] = a[0] * len;
+        out[1] = a[1] * len;
+    }
+    return out
+}
+
+var subtract_1 = subtract$1;
+
+/**
+ * Subtracts vector b from vector a
+ *
+ * @param {vec2} out the receiving vector
+ * @param {vec2} a the first operand
+ * @param {vec2} b the second operand
+ * @returns {vec2} out
+ */
+function subtract$1(out, a, b) {
+    out[0] = a[0] - b[0];
+    out[1] = a[1] - b[1];
+    return out
+}
+
+var dot_1 = dot$1;
+
+/**
+ * Calculates the dot product of two vec2's
+ *
+ * @param {vec2} a the first operand
+ * @param {vec2} b the second operand
+ * @returns {Number} dot product of a and b
+ */
+function dot$1(a, b) {
+    return a[0] * b[0] + a[1] * b[1]
+}
+
+var add = add_1;
+var set = set_1;
+var normalize = normalize_1;
+var subtract = subtract_1;
+var dot = dot_1;
+
+var tmp = [0, 0];
+
+polylineMiterUtil.computeMiter = function computeMiter(tangent, miter, lineA, lineB, halfThick) {
+    //get tangent line
+    add(tangent, lineA, lineB);
+    normalize(tangent, tangent);
+
+    //get miter as a unit vector
+    set(miter, -tangent[1], tangent[0]);
+    set(tmp, -lineA[1], lineA[0]);
+
+    //get the necessary length of our miter
+    return halfThick / dot(miter, tmp)
+};
+
+polylineMiterUtil.normal = function normal(out, dir) {
+    //get perpendicular
+    set(out, -dir[1], dir[0]);
+    return out
+};
+
+polylineMiterUtil.direction = function direction(out, a, b) {
+    //get unit dir of two lines
+    subtract(out, a, b);
+    normalize(out, out);
+    return out
+};
+
+var util = polylineMiterUtil;
+
+var lineA = [0, 0];
+var lineB = [0, 0];
+var tangent = [0, 0];
+var miter = [0, 0];
+
+var polylineNormals = function(points, closed) {
+    var curNormal = null;
+    var out = [];
+    if (closed) {
+        points = points.slice();
+        points.push(points[0]);
+    }
+
+    var total = points.length;
+    for (var i=1; i<total; i++) {
+        var last = points[i-1];
+        var cur = points[i];
+        var next = i<points.length-1 ? points[i+1] : null;
+
+        util.direction(lineA, cur, last);
+        if (!curNormal)  {
+            curNormal = [0, 0];
+            util.normal(curNormal, lineA);
+        }
+
+        if (i === 1) //add initial normals
+            addNext(out, curNormal, 1);
+
+        if (!next) { //no miter, simple segment
+            util.normal(curNormal, lineA); //reset normal
+            addNext(out, curNormal, 1);
+        } else { //miter with last
+            //get unit dir of next line
+            util.direction(lineB, next, cur);
+
+            //stores tangent & miter
+            var miterLen = util.computeMiter(tangent, miter, lineA, lineB, 1);
+            addNext(out, miter, miterLen);
+        }
+    }
+
+    //if the polyline is a closed loop, clean up the last normal
+    if (points.length > 2 && closed) {
+        var last2 = points[total-2];
+        var cur2 = points[0];
+        var next2 = points[1];
+
+        util.direction(lineA, cur2, last2);
+        util.direction(lineB, next2, cur2);
+        util.normal(curNormal, lineA);
+        
+        var miterLen2 = util.computeMiter(tangent, miter, lineA, lineB, 1);
+        out[0][0] = miter.slice();
+        out[total-1][0] = miter.slice();
+        out[0][1] = miterLen2;
+        out[total-1][1] = miterLen2;
+        out.pop();
+    }
+
+    return out
+};
+
+function addNext(out, normal, length) {
+    out.push([[normal[0], normal[1]], length]);
+}
+
 // 定义常量
 const TRIANGLE_NUMBER_OF_RECTANGLE = 2; // 每个矩形有两个三角形
 const VERTEX_NUMBER_OF_TRIANGLE = 3; // 每个三角形有三个顶点
@@ -18135,7 +18320,7 @@ function getLineGeometry(positionList) {
     const divisions = Math.ceil(curve.getLength()); // 曲线切片数
     const curvePoints = curve.getPoints(divisions);
     const curvePointsLength = curvePoints.length;
-    const normals = getNormals__default["default"](curvePoints.map((p) => [p.x, p.z])); // curvePoints：每个点切线的向量「二维」
+    const normals = polylineNormals(curvePoints.map((p) => [p.x, p.z])); // curvePoints：每个点切线的向量「二维」
     const rectangleNumber = curvePoints.length - 1; // 曲线上 N 个点，构成了 N - 1 个矩形
     const indexNumber = rectangleNumber * TRIANGLE_NUMBER_OF_RECTANGLE * VERTEX_NUMBER_OF_TRIANGLE;
     const verticesNumber = 2 * curvePointsLength; // 顶点数量（包含公用）：每个曲线点对应两个顶点，N 个 点有 2N 个顶点

package/dist/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('three'), require('three/examples/jsm/renderers/CSS3DRenderer'), require('@realsee/five/line'), require('svelte/internal'), require('svelte'), require('svelte/easing'), require('svelte/transition'), require('svelte/store'), require('@realsee/five'), require('three/examples/jsm/loaders/FBXLoader'), require('@tweenjs/tween.js'), require('hammerjs'), require('classnames'), require('polyline-normals')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'three', 'three/examples/jsm/renderers/CSS3DRenderer', '@realsee/five/line', 'svelte/internal', 'svelte', 'svelte/easing', 'svelte/transition', 'svelte/store', '@realsee/five', 'three/examples/jsm/loaders/FBXLoader', '@tweenjs/tween.js', 'hammerjs', 'classnames', 'polyline-normals'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.dnalogel = {}, global.THREE, global.CSS3DRenderer, global.FiveSDK_Line, global.internal, global.svelte, global.easing, global.transition, global.store, global.five, global.FBXLoader, global.TWEEN, global.Hammer, global.classNames, global.getNormals));
-})(this, (function (exports, THREE, CSS3DRenderer, line, internal, svelte, easing, transition, store, five, FBXLoader, TWEEN, Hammer, classNames, getNormals) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('three'), require('three/examples/jsm/renderers/CSS3DRenderer'), require('@realsee/five/line'), require('svelte/internal'), require('svelte'), require('svelte/easing'), require('svelte/transition'), require('svelte/store'), require('@realsee/five'), require('three/examples/jsm/loaders/FBXLoader'), require('@tweenjs/tween.js'), require('hammerjs'), require('classnames')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'three', 'three/examples/jsm/renderers/CSS3DRenderer', '@realsee/five/line', 'svelte/internal', 'svelte', 'svelte/easing', 'svelte/transition', 'svelte/store', '@realsee/five', 'three/examples/jsm/loaders/FBXLoader', '@tweenjs/tween.js', 'hammerjs', 'classnames'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.dnalogel = {}, global.THREE, global.CSS3DRenderer, global.FiveSDK_Line, global.internal, global.svelte, global.easing, global.transition, global.store, global.five, global.FBXLoader, global.TWEEN, global.Hammer, global.classNames));
+})(this, (function (exports, THREE, CSS3DRenderer, line, internal, svelte, easing, transition, store, five, FBXLoader, TWEEN, Hammer, classNames) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -29,7 +29,6 @@
     var TWEEN__default = /*#__PURE__*/_interopDefaultLegacy(TWEEN);
     var Hammer__default = /*#__PURE__*/_interopDefaultLegacy(Hammer);
     var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
-    var getNormals__default = /*#__PURE__*/_interopDefaultLegacy(getNormals);
 
     /**
      * Five 模型插件
@@ -18103,6 +18102,193 @@ void main() {
         return new PanoDoorLabelPluginController(five);
     };
 
+    var polylineMiterUtil = {};
+
+    var add_1 = add$1;
+
+    /**
+     * Adds two vec2's
+     *
+     * @param {vec2} out the receiving vector
+     * @param {vec2} a the first operand
+     * @param {vec2} b the second operand
+     * @returns {vec2} out
+     */
+    function add$1(out, a, b) {
+        out[0] = a[0] + b[0];
+        out[1] = a[1] + b[1];
+        return out
+    }
+
+    var set_1 = set$1;
+
+    /**
+     * Set the components of a vec2 to the given values
+     *
+     * @param {vec2} out the receiving vector
+     * @param {Number} x X component
+     * @param {Number} y Y component
+     * @returns {vec2} out
+     */
+    function set$1(out, x, y) {
+        out[0] = x;
+        out[1] = y;
+        return out
+    }
+
+    var normalize_1 = normalize$1;
+
+    /**
+     * Normalize a vec2
+     *
+     * @param {vec2} out the receiving vector
+     * @param {vec2} a vector to normalize
+     * @returns {vec2} out
+     */
+    function normalize$1(out, a) {
+        var x = a[0],
+            y = a[1];
+        var len = x*x + y*y;
+        if (len > 0) {
+            //TODO: evaluate use of glm_invsqrt here?
+            len = 1 / Math.sqrt(len);
+            out[0] = a[0] * len;
+            out[1] = a[1] * len;
+        }
+        return out
+    }
+
+    var subtract_1 = subtract$1;
+
+    /**
+     * Subtracts vector b from vector a
+     *
+     * @param {vec2} out the receiving vector
+     * @param {vec2} a the first operand
+     * @param {vec2} b the second operand
+     * @returns {vec2} out
+     */
+    function subtract$1(out, a, b) {
+        out[0] = a[0] - b[0];
+        out[1] = a[1] - b[1];
+        return out
+    }
+
+    var dot_1 = dot$1;
+
+    /**
+     * Calculates the dot product of two vec2's
+     *
+     * @param {vec2} a the first operand
+     * @param {vec2} b the second operand
+     * @returns {Number} dot product of a and b
+     */
+    function dot$1(a, b) {
+        return a[0] * b[0] + a[1] * b[1]
+    }
+
+    var add = add_1;
+    var set = set_1;
+    var normalize = normalize_1;
+    var subtract = subtract_1;
+    var dot = dot_1;
+
+    var tmp = [0, 0];
+
+    polylineMiterUtil.computeMiter = function computeMiter(tangent, miter, lineA, lineB, halfThick) {
+        //get tangent line
+        add(tangent, lineA, lineB);
+        normalize(tangent, tangent);
+
+        //get miter as a unit vector
+        set(miter, -tangent[1], tangent[0]);
+        set(tmp, -lineA[1], lineA[0]);
+
+        //get the necessary length of our miter
+        return halfThick / dot(miter, tmp)
+    };
+
+    polylineMiterUtil.normal = function normal(out, dir) {
+        //get perpendicular
+        set(out, -dir[1], dir[0]);
+        return out
+    };
+
+    polylineMiterUtil.direction = function direction(out, a, b) {
+        //get unit dir of two lines
+        subtract(out, a, b);
+        normalize(out, out);
+        return out
+    };
+
+    var util = polylineMiterUtil;
+
+    var lineA = [0, 0];
+    var lineB = [0, 0];
+    var tangent = [0, 0];
+    var miter = [0, 0];
+
+    var polylineNormals = function(points, closed) {
+        var curNormal = null;
+        var out = [];
+        if (closed) {
+            points = points.slice();
+            points.push(points[0]);
+        }
+
+        var total = points.length;
+        for (var i=1; i<total; i++) {
+            var last = points[i-1];
+            var cur = points[i];
+            var next = i<points.length-1 ? points[i+1] : null;
+
+            util.direction(lineA, cur, last);
+            if (!curNormal)  {
+                curNormal = [0, 0];
+                util.normal(curNormal, lineA);
+            }
+
+            if (i === 1) //add initial normals
+                addNext(out, curNormal, 1);
+
+            if (!next) { //no miter, simple segment
+                util.normal(curNormal, lineA); //reset normal
+                addNext(out, curNormal, 1);
+            } else { //miter with last
+                //get unit dir of next line
+                util.direction(lineB, next, cur);
+
+                //stores tangent & miter
+                var miterLen = util.computeMiter(tangent, miter, lineA, lineB, 1);
+                addNext(out, miter, miterLen);
+            }
+        }
+
+        //if the polyline is a closed loop, clean up the last normal
+        if (points.length > 2 && closed) {
+            var last2 = points[total-2];
+            var cur2 = points[0];
+            var next2 = points[1];
+
+            util.direction(lineA, cur2, last2);
+            util.direction(lineB, next2, cur2);
+            util.normal(curNormal, lineA);
+            
+            var miterLen2 = util.computeMiter(tangent, miter, lineA, lineB, 1);
+            out[0][0] = miter.slice();
+            out[total-1][0] = miter.slice();
+            out[0][1] = miterLen2;
+            out[total-1][1] = miterLen2;
+            out.pop();
+        }
+
+        return out
+    };
+
+    function addNext(out, normal, length) {
+        out.push([[normal[0], normal[1]], length]);
+    }
+
     // 定义常量
     const TRIANGLE_NUMBER_OF_RECTANGLE = 2; // 每个矩形有两个三角形
     const VERTEX_NUMBER_OF_TRIANGLE = 3; // 每个三角形有三个顶点
@@ -18122,7 +18308,7 @@ void main() {
         const divisions = Math.ceil(curve.getLength()); // 曲线切片数
         const curvePoints = curve.getPoints(divisions);
         const curvePointsLength = curvePoints.length;
-        const normals = getNormals__default["default"](curvePoints.map((p) => [p.x, p.z])); // curvePoints：每个点切线的向量「二维」
+        const normals = polylineNormals(curvePoints.map((p) => [p.x, p.z])); // curvePoints：每个点切线的向量「二维」
         const rectangleNumber = curvePoints.length - 1; // 曲线上 N 个点，构成了 N - 1 个矩形
         const indexNumber = rectangleNumber * TRIANGLE_NUMBER_OF_RECTANGLE * VERTEX_NUMBER_OF_TRIANGLE;
         const verticesNumber = 2 * curvePointsLength; // 顶点数量（包含公用）：每个曲线点对应两个顶点，N 个 点有 2N 个顶点