mxdraw 0.1.16 → 0.1.21

package/dist/lib/MxModule/MxDrawObject/index.js

@@ -1 +1,5 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var MxDrawObject_1=require("./MxDrawObject");exports.default=MxDrawObject_1.default;
+"use strict";
+/** @module MxDrawObject */
+Object.defineProperty(exports, "__esModule", { value: true });
+var MxDrawObject_1 = require("./MxDrawObject");
+exports.default = MxDrawObject_1.default;

package/dist/lib/MxModule/MxFilters/MxFilters.js

@@ -1 +1,201 @@
-"use strict";var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(t){for(var e,r=1,i=arguments.length;r<i;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};Object.defineProperty(exports,"__esModule",{value:!0});var three_1=require("three"),MxFilters=function(){function t(){this.uniformObj={},this.filtersStr="",this.filtersTypes="",this.VSHADER_SOURCE="\n  varying vec2 v_Uv; \n  void main () {\n      v_Uv = uv;\n      gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n  }\n  ",this.FSHADER_SOURCE="\n  varying vec2 v_Uv;\n  uniform sampler2D e_Texture;\n  uniform mat4 colorMatrix;\n  ".concat(this.filtersStr,"\n  void main () {\n    vec4 color = texture2D( e_Texture, v_Uv );\n    color = color * colorMatrix;\n    ").concat(this.filtersTypes,"\n    gl_FragColor = color;\n  }"),this._matrix=new three_1.Matrix4}return t.prototype.channel=function(t){var e=t.r,r=void 0===e?1:e,i=t.g,o=void 0===i?1:i,n=t.b,s=void 0===n?1:n;return this._matrix=(new three_1.Matrix4).set(r,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1).multiply(this._matrix),this},t.prototype.brightness=function(t){return this._matrix=(new three_1.Matrix4).set(t,0,0,0,0,t,0,0,0,0,t,0,0,0,0,1).multiply(this._matrix),this},t.prototype.saturate=function(t){var e=.2126*(1-t),r=.7152*(1-t),i=.0722*(1-t);return this._matrix=(new three_1.Matrix4).set(e+t,r,i,0,e,r+t,i,0,e,r,i+t,0,0,0,0,1).multiply(this._matrix),this},t.prototype.contrast=function(t){var e=.5*(1-t);return this._matrix=(new three_1.Matrix4).set(t,0,0,0,0,t,0,0,0,0,t,0,e,e,e,1).multiply(this._matrix),this},t.prototype.opacity=function(t){return this._matrix=(new three_1.Matrix4).set(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,t).multiply(this._matrix),this},t.prototype.invert=function(t){var e=1-2*t;return this._matrix=(new three_1.Matrix4).set(e,0,0,0,0,e,0,0,0,0,e,0,t,t,t,1).multiply(this._matrix),this},t.prototype.grayscale=function(t){void 0===t&&(t=1);var e=.2126*t,r=.7152*t,i=.0722*t;return this._matrix=(new three_1.Matrix4).set(e+1-t,r,i,0,e,r+1-t,i,0,e,r,i+1-t,0,0,0,0,1).multiply(this._matrix),this},t.prototype.sepia=function(t){return void 0===t&&(t=1),this._matrix=(new three_1.Matrix4).set(1-.607*t,.769*t,.189*t,0,.349*t,1-.314*t,.168*t,0,.272*t,.534*t,1-.869*t,0,0,0,0,1).multiply(this._matrix),this},t.prototype.hueRotate=function(t){var e=t/180*Math.PI,r=Math.cos(e),i=Math.sin(e);return this._matrix=(new three_1.Matrix4).set(.2126+.7874*r+-.2126*i,.7152+-.7152*r+-.7152*i,.0722+-.0722*r+.9278*i,0,.2126+-.2126*r+.143*i,.7152+r*(1-.7152)+.14*i,.0722+-.0722*r+-.283*i,0,.2126+-.2126*r+-.7874*i,.7152+-.7152*r+.7152*i,.0722+.9278*r+.0722*i,0,0,0,0,1).multiply(this._matrix),this},t.prototype.convolution=function(t,e,r){return void 0===e&&(e=1/9),void 0===r&&(r=521),this.uniformObj=__assign(__assign({},this.uniformObj),{cKernel:{value:t.toArray()},stStep:{value:e},scaleFactor:{value:r}}),this.filtersTypes.indexOf("convolutionTextureColor")<0&&(this.filtersStr+="\n        uniform float cKernel[9];\n        uniform float stStep;\n        uniform float scaleFactor;\n        vec4 convolutionTextureColor(vec4 color) {\n            vec2 offsets[9];\n            offsets[0] = vec2(-1.0,-1.0);\n            offsets[1] =  vec2(0.0,-1.0);\n            offsets[2] = vec2(1.0,-1.0);\n            offsets[3] =  vec2(-1.0,0.0);\n            offsets[4] = vec2(0.0,0.0);\n            offsets[5] = vec2(1.0,0.0);\n            offsets[6] =  vec2(-1.0,1.0);\n            offsets[7] = vec2(0.0,1.0);\n            offsets[8] = vec2(1.0,1.0);\n        \n            vec4 sum = color;\n            for(int i = 0; i < 9; i++) {\n                sum = sum + cKernel[i] * scaleFactor * texture2D(e_Texture, v_Uv + offsets[i] / stStep);\n            };\n            return sum;\n        }",this.filtersTypes+="color = convolutionTextureColor(color);\n"),this},t.prototype.reset=function(){return this.uniformObj={},this.filtersStr="",this.filtersTypes="",this._matrix=new three_1.Matrix4,this},t.prototype._getFilterShaderData=function(t){return{uniforms:__assign({e_Texture:{value:t},colorMatrix:{value:this._matrix}},this.uniformObj),vertexShader:this.VSHADER_SOURCE,fragmentShader:this.FSHADER_SOURCE}},t.prototype._getFilterColor=function(t,e){void 0===t&&(t="#000000"),void 0===e&&(e=1);var r=(t=new three_1.Color(t)).r,i=t.g,o=t.b,n=this._matrix.toArray(),s=(n[12],n[13],n[14],n[15],n[0]*r+n[1]*r+n[2]*r+n[3]*e),a=n[4]*i+n[5]*i+n[6]*i+n[7]*e,u=n[8]*o+n[9]*o+n[10]*o+n[11]*e;return t.setRGB(s,a,u),t},t}();exports.default=MxFilters;
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/** 简单颜色滤镜矩阵 */
+var three_1 = require("three");
+var MxFilters = /** @class */ (function () {
+    function MxFilters() {
+        this.uniformObj = {};
+        this.filtersStr = '';
+        this.filtersTypes = '';
+        //顶点着色器代码片段
+        this.VSHADER_SOURCE = "\n  varying vec2 v_Uv; \n  void main () {\n      v_Uv = uv;\n      gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n  }\n  ";
+        //片元着色器代码片段
+        this.FSHADER_SOURCE = "\n  varying vec2 v_Uv;\n  uniform sampler2D e_Texture;\n  uniform mat4 colorMatrix;\n  ".concat(this.filtersStr, "\n  void main () {\n    vec4 color = texture2D( e_Texture, v_Uv );\n    color = color * colorMatrix;\n    ").concat(this.filtersTypes, "\n    gl_FragColor = color;\n  }");
+        this._matrix = new three_1.Matrix4();
+    }
+    /**
+     * 过滤或增强某个颜色通道
+     * @param {ChannelParamTypes}
+     * */
+    MxFilters.prototype.channel = function (_a) {
+        var _b = _a.r, r = _b === void 0 ? 1 : _b, _c = _a.g, g = _c === void 0 ? 1 : _c, _d = _a.b, b = _d === void 0 ? 1 : _d;
+        this._matrix = new three_1.Matrix4()
+            .set(r, 0, 0, 0, 0, g, 0, 0, 0, 0, b, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 改变亮度
+     * @param {number} p
+     * p = 0 全暗，p > 0 且 p < 1 调暗，p = 1 原色， p > 1 调亮
+     * */
+    MxFilters.prototype.brightness = function (p) {
+        this._matrix = new three_1.Matrix4()
+            .set(p, 0, 0, 0, 0, p, 0, 0, 0, 0, p, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 饱和度
+     * @param {number} p
+     * p = 0 完全灰度化，p = 1 原色，p > 1 增强饱和度
+     * */
+    MxFilters.prototype.saturate = function (p) {
+        var r = 0.2126 * (1 - p);
+        var g = 0.7152 * (1 - p);
+        var b = 0.0722 * (1 - p);
+        this._matrix = new three_1.Matrix4()
+            .set(r + p, g, b, 0, r, g + p, b, 0, r, g, b + p, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 对比度
+     * @param {number} p
+     *  p = 1 原色， p < 1 减弱对比度，p > 1 增强对比度
+     * */
+    MxFilters.prototype.contrast = function (p) {
+        var d = 0.5 * (1 - p);
+        this._matrix = new three_1.Matrix4()
+            .set(p, 0, 0, 0, 0, p, 0, 0, 0, 0, p, 0, d, d, d, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 透明度
+     * @param {number} p
+     * p = 0 全透明，p = 1 原色
+     * */
+    MxFilters.prototype.opacity = function (p) {
+        this._matrix = new three_1.Matrix4()
+            .set(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, p)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 反色
+     * @param {number} p
+     * p = 0 原色， p = 1 完全反色
+     * */
+    MxFilters.prototype.invert = function (p) {
+        var d = 1 - 2 * p;
+        this._matrix = new three_1.Matrix4()
+            .set(d, 0, 0, 0, 0, d, 0, 0, 0, 0, d, 0, p, p, p, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 灰度
+     * @param {number} p 0~1
+     * */
+    MxFilters.prototype.grayscale = function (p) {
+        if (p === void 0) { p = 1; }
+        var r = 0.2126 * p;
+        var g = 0.7152 * p;
+        var b = 0.0722 * p;
+        this._matrix = new three_1.Matrix4()
+            .set(r + 1 - p, g, b, 0, r, g + 1 - p, b, 0, r, g, b + 1 - p, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 深褐色
+     * @param {number} p 0~1
+     * */
+    MxFilters.prototype.sepia = function (p) {
+        if (p === void 0) { p = 1; }
+        this._matrix = new three_1.Matrix4()
+            .set(1 - 0.607 * p, 0.769 * p, 0.189 * p, 0, 0.349 * p, 1 - 0.314 * p, 0.168 * p, 0, 0.272 * p, 0.534 * p, 1 - 0.869 * p, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 色相旋转，将色调沿极坐标转过deg角度
+     * @param {number} deg 0~360
+     * */
+    MxFilters.prototype.hueRotate = function (deg) {
+        var rotation = (deg / 180) * Math.PI;
+        var cos = Math.cos(rotation), sin = Math.sin(rotation), lumR = 0.2126, lumG = 0.7152, lumB = 0.0722;
+        this._matrix = new three_1.Matrix4()
+            .set(lumR + cos * (1 - lumR) + sin * -lumR, lumG + cos * -lumG + sin * -lumG, lumB + cos * -lumB + sin * (1 - lumB), 0, lumR + cos * -lumR + sin * 0.143, lumG + cos * (1 - lumG) + sin * 0.14, lumB + cos * -lumB + sin * -0.283, 0, lumR + cos * -lumR + sin * -(1 - lumR), lumG + cos * -lumG + sin * lumG, lumB + cos * (1 - lumB) + sin * lumB, 0, 0, 0, 0, 1)
+            .multiply(this._matrix);
+        return this;
+    };
+    /**
+     * 色相旋转，将色调沿极坐标转过deg角度
+     * @param {number} deg 0~360
+     * */
+    /**
+     * 卷积
+     * @param {Matrix3} cKernel 3*3的矩阵
+     * @param {number} stStep 1 / 9
+     * @param {number} scaleFactor 521
+     * */
+    MxFilters.prototype.convolution = function (cKernel, stStep, scaleFactor) {
+        if (stStep === void 0) { stStep = 1 / 9; }
+        if (scaleFactor === void 0) { scaleFactor = 521; }
+        this.uniformObj = __assign(__assign({}, this.uniformObj), { cKernel: {
+                value: cKernel.toArray()
+            }, stStep: {
+                value: stStep
+            }, scaleFactor: {
+                value: scaleFactor
+            } });
+        if (this.filtersTypes.indexOf('convolutionTextureColor') < 0) {
+            this.filtersStr += "\n        uniform float cKernel[9];\n        uniform float stStep;\n        uniform float scaleFactor;\n        vec4 convolutionTextureColor(vec4 color) {\n            vec2 offsets[9];\n            offsets[0] = vec2(-1.0,-1.0);\n            offsets[1] =  vec2(0.0,-1.0);\n            offsets[2] = vec2(1.0,-1.0);\n            offsets[3] =  vec2(-1.0,0.0);\n            offsets[4] = vec2(0.0,0.0);\n            offsets[5] = vec2(1.0,0.0);\n            offsets[6] =  vec2(-1.0,1.0);\n            offsets[7] = vec2(0.0,1.0);\n            offsets[8] = vec2(1.0,1.0);\n        \n            vec4 sum = color;\n            for(int i = 0; i < 9; i++) {\n                sum = sum + cKernel[i] * scaleFactor * texture2D(e_Texture, v_Uv + offsets[i] / stStep);\n            };\n            return sum;\n        }";
+            this.filtersTypes += 'color = convolutionTextureColor(color);\n';
+        }
+        return this;
+    };
+    /**
+     * 重置所有滤镜效果
+     * */
+    MxFilters.prototype.reset = function () {
+        this.uniformObj = {};
+        this.filtersStr = '';
+        this.filtersTypes = '';
+        this._matrix = new three_1.Matrix4();
+        return this;
+    };
+    // 获取滤镜自定义着色器数据
+    MxFilters.prototype._getFilterShaderData = function (texture) {
+        return {
+            uniforms: __assign({ e_Texture: {
+                    value: texture
+                }, colorMatrix: {
+                    value: this._matrix
+                } }, this.uniformObj),
+            // 顶点着色器
+            vertexShader: this.VSHADER_SOURCE,
+            // 片元着色器
+            fragmentShader: this.FSHADER_SOURCE
+        };
+    };
+    // 获取转换后的颜色
+    MxFilters.prototype._getFilterColor = function (color, opacity) {
+        if (color === void 0) { color = '#000000'; }
+        if (opacity === void 0) { opacity = 1; }
+        color = new three_1.Color(color);
+        var r = color.r, g = color.g, b = color.b;
+        var arr = this._matrix.toArray();
+        var A = arr[12] * opacity + arr[13] * opacity + arr[14] * opacity + arr[15] * opacity + 0;
+        var R = arr[0] * r + arr[1] * r + arr[2] * r + arr[3] * opacity;
+        var G = arr[4] * g + arr[5] * g + arr[6] * g + arr[7] * opacity;
+        var B = arr[8] * b + arr[9] * b + arr[10] * b + arr[11] * opacity;
+        color.setRGB(R, G, B);
+        return color;
+    };
+    return MxFilters;
+}());
+exports.default = MxFilters;

package/dist/lib/MxModule/MxFilters/index.js

@@ -1 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var MxFilters_1=require("./MxFilters");exports.default=MxFilters_1.default;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var MxFilters_1 = require("./MxFilters");
+exports.default = MxFilters_1.default;