@xviewer.js/core 1.0.4-alpha.8 → 1.0.4

package/dist/main.cjs

@@ -3743,7 +3743,9 @@ uniform float     roughness;
 uniform float     metalness;
 uniform sampler2D map;
 uniform sampler2D normalMap;
+uniform vec4      normalScaleBias;     
 uniform sampler2D roughnessMap;
+uniform vec4      roughnessScaleBias;    
 uniform sampler2D aoMap;
 uniform float     aoMapIntensity;
 uniform sampler2D lightMap;
@@ -3781,7 +3783,7 @@ void main() {
     vec2 reflectUv = coord.xy;
 
 #ifdef USE_NORMALMAP
-    vec4 texelNormal = texture2D(normalMap, UV_NORMAL);
+    vec4 texelNormal = texture2D(normalMap, UV_NORMAL * normalScaleBias.xy + normalScaleBias.zw);
     vec3 normal = normalize(vec3(texelNormal.r * 2.0 - 1.0, texelNormal.b,  texelNormal.g * 2.0 - 1.0));
     reflectUv += coord.z * normal.xz * 0.05;
 #endif
@@ -3808,7 +3810,7 @@ void main() {
     float roughnessFactor = roughness;
 
 #ifdef USE_ROUGHNESSMAP
-    roughnessFactor *= texture2D(roughnessMap, UV_ROUGHNESS).g * roughness;
+    roughnessFactor *= texture2D(roughnessMap, UV_ROUGHNESS * roughnessScaleBias.xy + roughnessScaleBias.zw).g * roughness;
 #endif
 
     computeMultiscattering( geometryNormal, geometryViewDir, specularColor, specularF90, roughnessFactor, singleScattering, multiScattering );
@@ -3820,6 +3822,8 @@ void main() {
 
 #ifdef USE_LIGHTMAP
     irradiance += texture2D(lightMap, UV_LIGHTMAP).rgb * lightMapIntensity;
+#else
+    irradiance += vec3(1.);
 #endif
 
     float lod = roughnessFactor * (1.7 - 0.7 * roughnessFactor) * 6.;
@@ -3906,12 +3910,24 @@ class ReflectorMaterial extends THREE.ShaderMaterial {
     set roughnessMap(v) {
         this.uniforms.roughnessMap.value = v;
     }
+    get roughnessScaleBias() {
+        return this.uniforms.roughnessScaleBias.value;
+    }
+    set roughnessScaleBias(v) {
+        this.uniforms.roughnessScaleBias.value.copy(v);
+    }
     get normalMap() {
         return this.uniforms.normalMap.value;
     }
     set normalMap(v) {
         this.uniforms.normalMap.value = v;
     }
+    get normalScaleBias() {
+        return this.uniforms.normalScaleBias.value;
+    }
+    set normalScaleBias(v) {
+        this.uniforms.normalScaleBias.value.copy(v);
+    }
     get aoMap() {
         return this.uniforms.aoMap.value;
     }
@@ -3976,9 +3992,15 @@ class ReflectorMaterial extends THREE.ShaderMaterial {
             roughnessMap: {
                 value: null
             },
+            roughnessScaleBias: {
+                value: new THREE.Vector4(1, 1, 0, 0)
+            },
             normalMap: {
                 value: null
             },
+            normalScaleBias: {
+                value: new THREE.Vector4(1, 1, 0, 0)
+            },
             aoMap: {
                 value: null
             },
@@ -4024,9 +4046,15 @@ __decorate([
 __decorate([
     property
 ], ReflectorMaterial.prototype, "roughnessMap", null);
+__decorate([
+    property
+], ReflectorMaterial.prototype, "roughnessScaleBias", null);
 __decorate([
     property
 ], ReflectorMaterial.prototype, "normalMap", null);
+__decorate([
+    property
+], ReflectorMaterial.prototype, "normalScaleBias", null);
 __decorate([
     property
 ], ReflectorMaterial.prototype, "aoMap", null);
@@ -4343,10 +4371,13 @@ class TaskManager {
     destroy() {
         this._tasks = [];
         this._taskIndex = 0;
-        clearInterval(this._interval);
     }
     add(task) {
         this._tasks.push(task);
+        if (this._onStartCalled === false) {
+            this._onStartCalled = true;
+            this.onStart && this.onStart();
+        }
     }
     update() {
         let task = this._tasks[this._taskIndex];
@@ -4358,13 +4389,9 @@ class TaskManager {
                 this.onError && this.onError(task);
             }
             ++this._taskIndex;
-            if (this._onstartCalled === false) {
-                this._onstartCalled = true;
-                this.onStart && this.onStart();
-            }
             this.onProgress && this.onProgress(task, this._taskIndex, this._tasks.length);
             if (this._taskIndex === this._tasks.length) {
-                this._onstartCalled = false;
+                this._onStartCalled = false;
                 this.onComplete && this.onComplete();
             }
         }
@@ -4375,9 +4402,7 @@ class TaskManager {
         this.onError = onError;
         this._tasks = [];
         this._taskIndex = 0;
-        this._interval = null;
-        this._onstartCalled = false;
-        this._interval = setInterval(()=>this.update());
+        this._onStartCalled = false;
     }
 }
 
@@ -4530,10 +4555,11 @@ ResourceManager._texSettingKeys = [
 ];
 
 class Task {
-    constructor(excute, name = "task" + this.instanceId){
-        this.excute = excute;
-        this.name = name;
+    constructor(excute, name){
         this.instanceId = Task._instanceCount++;
+        this.name = "task" + this.instanceId;
+        this.excute = excute;
+        this.name = name || this.name;
     }
 }
 Task._instanceCount = 0;
@@ -4724,16 +4750,22 @@ class Viewer extends EventEmitter {
         }
     }
     loop(dt) {
-        dt = Math.min(dt, 0.067);
-        this._renderer.info.reset();
-        this._componentManager.update(dt);
-        this._componentManager.render(dt);
+        this._taskManager.update();
+        if (!this._loading && !this._tasking && this._running > 0) {
+            this._running--;
+        }
+        if (this._running <= 0) {
+            dt = Math.min(dt, 0.067);
+            this._renderer.info.reset();
+            this._componentManager.update(dt);
+            this._componentManager.render(dt);
+        }
     }
     start() {
-        if (this._running == false) {
-            this._running = true;
+        if (this._active == false) {
+            this._active = true;
             const frameCallback = (time)=>{
-                if (this._running) {
+                if (this._active) {
                     this._frame(time * 0.001);
                 }
             };
@@ -4742,7 +4774,8 @@ class Viewer extends EventEmitter {
         return this;
     }
     stop() {
-        this._running = false;
+        this._active = false;
+        this._running = 4;
         this._time = this._lastTime = 0;
         return this;
     }
@@ -5092,7 +5125,8 @@ class Viewer extends EventEmitter {
             width: 1,
             height: 1,
             factor: 1
-        }, this._running = false, this._rootRotated = false, this._time = 0, this._lastTime = 0, this._lastFrameTime = 0, this._targetFrameRate = -1, this._fixedFrameTime = false, this._windowSize = ()=>[
+        }, this._active = false, this._loading = false, this._tasking = false, this._running = 4 //延迟4帧执行
+        , this._rootRotated = false, this._time = 0, this._lastTime = 0, this._lastFrameTime = 0, this._targetFrameRate = -1, this._fixedFrameTime = false, this._windowSize = ()=>[
                 window.innerWidth,
                 window.innerHeight
             ], this._orientation = Orientation.AUTO;
@@ -5124,21 +5158,14 @@ class Viewer extends EventEmitter {
         this._renderer.sortObjects = sortObjects;
         this._targetFrameRate = targetFrameRate;
         this._windowSize = typeof resize === "function" ? resize : resize === ResizeMode.AUTO ? this._windowSize : null;
-        const states = {
-            tasking: false,
-            loading: false};
-        const start = ()=>{
-            !states.tasking && !states.loading && this.start();
-        };
         const complete = (set, cb)=>{
             set();
             cb && cb();
-            !this._running && setTimeout(start);
         };
-        this._taskManager = new TaskManager(()=>complete(()=>states.tasking = false, tasker.onComplete), tasker.onProgress, tasker.onError);
-        this._taskManager.onStart = ()=>states.tasking = true;
-        this._loadingManager = new THREE.LoadingManager(()=>complete(()=>states.loading = false, loader.onComplete), loader.onProgress, loader.onError);
-        this._loadingManager.onStart = ()=>states.loading = true;
+        this._taskManager = new TaskManager(()=>complete(()=>this._tasking = false, tasker.onComplete), tasker.onProgress, tasker.onError);
+        this._taskManager.onStart = ()=>this._tasking = true;
+        this._loadingManager = new THREE.LoadingManager(()=>complete(()=>this._loading = false, loader.onComplete), loader.onProgress, loader.onError);
+        this._loadingManager.onStart = ()=>this._loading = true;
         this._resourceManager = new ResourceManager(this);
         this._componentManager = new ComponentManager(this);
         this._resourceOptions = {
@@ -5165,7 +5192,7 @@ class Viewer extends EventEmitter {
         setTimeout(()=>{
             this.rotate();
             this.resize();
-            start();
+            this.start();
         });
     }
 }
@@ -5889,10 +5916,698 @@ function getFilesFromItemList(items, onDone) {
     }
 }
 
+const newline = /\n/;
+const newlineChar = '\n';
+const whitespace = /\s/;
+function wordwrap(text, opt) {
+    opt = opt || {};
+    //zero width results in nothing visible
+    if (opt.width === 0 && opt.mode !== 'nowrap') return [];
+    text = text || '';
+    const width = typeof opt.width === 'number' ? opt.width : Number.MAX_VALUE;
+    const start = Math.max(0, opt.start || 0);
+    const end = typeof opt.end === 'number' ? opt.end : text.length;
+    const mode = opt.mode;
+    const letterSpacing = opt.letterSpacing || 0;
+    const measure = opt.measure || monospace;
+    if (mode === 'pre') return pre(measure, text, start, end, width, letterSpacing);
+    else return greedy(measure, text, start, end, width, mode, letterSpacing);
+}
+function idxOf(text, chr, start, end) {
+    var idx = text.indexOf(chr, start);
+    if (idx === -1 || idx > end) return end;
+    return idx;
+}
+function isWhitespace(chr) {
+    return whitespace.test(chr);
+}
+function pre(measure, text, start, end, width, letterSpacing) {
+    var lines = [];
+    var lineStart = start;
+    for(var i = start; i < end && i < text.length; i++){
+        var chr = text.charAt(i);
+        var isNewline = newline.test(chr);
+        //If we've reached a newline, then step down a line
+        //Or if we've reached the EOF
+        if (isNewline || i === end - 1) {
+            var lineEnd = isNewline ? i : i + 1;
+            var measured = measure(text, lineStart, lineEnd, width, letterSpacing);
+            lines.push(measured);
+            lineStart = i + 1;
+        }
+    }
+    return lines;
+}
+function greedy(measure, text, start, end, width, mode, letterSpacing) {
+    //A greedy word wrapper based on LibGDX algorithm
+    //https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/BitmapFontCache.java
+    var lines = [];
+    var testWidth = width;
+    //if 'nowrap' is specified, we only wrap on newline chars
+    if (mode === 'nowrap') testWidth = Number.MAX_VALUE;
+    while(start < end && start < text.length){
+        //get next newline position
+        var newLine = idxOf(text, newlineChar, start, end);
+        //eat whitespace at start of line
+        while(start < newLine){
+            if (!isWhitespace(text.charAt(start))) break;
+            start++;
+        }
+        //determine visible # of glyphs for the available width
+        var measured = measure(text, start, newLine, testWidth, letterSpacing);
+        var lineEnd = start + (measured.end - measured.start);
+        var nextStart = lineEnd + newlineChar.length;
+        //if we had to cut the line before the next newline...
+        if (lineEnd < newLine) {
+            //find char to break on
+            while(lineEnd > start){
+                if (isWhitespace(text.charAt(lineEnd))) break;
+                lineEnd--;
+            }
+            if (lineEnd === start) {
+                if (nextStart > start + newlineChar.length) nextStart--;
+                lineEnd = nextStart; // If no characters to break, show all.
+            } else {
+                nextStart = lineEnd;
+                //eat whitespace at end of line
+                while(lineEnd > start){
+                    if (!isWhitespace(text.charAt(lineEnd - newlineChar.length))) break;
+                    lineEnd--;
+                }
+            }
+        }
+        if (lineEnd >= start) {
+            var result = measure(text, start, lineEnd, testWidth);
+            lines.push(result);
+        }
+        start = nextStart;
+    }
+    return lines;
+}
+//determines the visible number of glyphs within a given width
+function monospace(text, start, end, width) {
+    var glyphs = Math.min(width, end - start);
+    return {
+        start: start,
+        end: start + glyphs
+    };
+}
+
+const X_HEIGHTS = [
+    'x',
+    'e',
+    'a',
+    'o',
+    'n',
+    's',
+    'r',
+    'c',
+    'u',
+    'm',
+    'v',
+    'w',
+    'z'
+];
+const M_WIDTHS = [
+    'm',
+    'w'
+];
+const CAP_HEIGHTS = [
+    'H',
+    'I',
+    'N',
+    'E',
+    'F',
+    'K',
+    'L',
+    'T',
+    'U',
+    'V',
+    'W',
+    'X',
+    'Y',
+    'Z'
+];
+const TAB_ID = '\t'.charCodeAt(0);
+const SPACE_ID = ' '.charCodeAt(0);
+const ALIGN_LEFT = 0, ALIGN_CENTER = 1, ALIGN_RIGHT = 2;
+function findChar(array, value, start) {
+    start = start || 0;
+    for(let i = start; i < array.length; i++){
+        if (array[i].id === value) {
+            return i;
+        }
+    }
+    return -1;
+}
+function getGlyphById(font, id) {
+    if (!font.chars || font.chars.length === 0) return null;
+    let glyphIdx = findChar(font.chars, id);
+    if (glyphIdx >= 0) return font.chars[glyphIdx];
+    return null;
+}
+function getXHeight(font) {
+    for(let i = 0; i < X_HEIGHTS.length; i++){
+        let id = X_HEIGHTS[i].charCodeAt(0);
+        let idx = findChar(font.chars, id);
+        if (idx >= 0) return font.chars[idx].height;
+    }
+    return 0;
+}
+function getMGlyph(font) {
+    for(let i = 0; i < M_WIDTHS.length; i++){
+        let id = M_WIDTHS[i].charCodeAt(0);
+        let idx = findChar(font.chars, id);
+        if (idx >= 0) return font.chars[idx];
+    }
+    return 0;
+}
+function getCapHeight(font) {
+    for(let i = 0; i < CAP_HEIGHTS.length; i++){
+        let id = CAP_HEIGHTS[i].charCodeAt(0);
+        let idx = findChar(font.chars, id);
+        if (idx >= 0) return font.chars[idx].height;
+    }
+    return 0;
+}
+function getKerning(font, left, right) {
+    if (!font.kernings || font.kernings.length === 0) return 0;
+    let table = font.kernings;
+    for(let i = 0; i < table.length; i++){
+        let kern = table[i];
+        if (kern.first === left && kern.second === right) return kern.amount;
+    }
+    return 0;
+}
+function getAlignType(align) {
+    if (align === 'center') return ALIGN_CENTER;
+    else if (align === 'right') return ALIGN_RIGHT;
+    return ALIGN_LEFT;
+}
+class BMFontTextLayout {
+    get width() {
+        return this._width;
+    }
+    get height() {
+        return this._height;
+    }
+    get descender() {
+        return this._descender;
+    }
+    get ascender() {
+        return this._ascender;
+    }
+    get xHeight() {
+        return this._xHeight;
+    }
+    get baseline() {
+        return this._baseline;
+    }
+    get capHeight() {
+        return this._capHeight;
+    }
+    get lineHeight() {
+        return this._lineHeight;
+    }
+    get glyphs() {
+        return this._glyphs;
+    }
+    get linesTotal() {
+        return this._linesTotal;
+    }
+    update(font, text, setting) {
+        setting = Object.assign({
+            tabSize: 4,
+            width: 0,
+            letterSpacing: 0,
+            mode: "nowrap",
+            align: "left"
+        }, setting);
+        this._font = font;
+        const measure = this._computeMetrics.bind(this);
+        const lines = wordwrap(text, {
+            measure,
+            ...setting
+        });
+        const minWidth = setting.width || 0;
+        const glyphs = this._glyphs;
+        const maxLineWidth = lines.reduce((prev, line)=>Math.max(prev, line.width, minWidth), 0);
+        var _setting_lineHeight;
+        //the pen position
+        const lineHeight = (_setting_lineHeight = setting.lineHeight) != null ? _setting_lineHeight : font.common.lineHeight;
+        const baseline = font.common.base;
+        const descender = lineHeight - baseline;
+        const letterSpacing = setting.letterSpacing || 0;
+        const height = lineHeight * lines.length - descender;
+        const align = getAlignType(setting.align);
+        var _setting_anchor;
+        const anchor = (_setting_anchor = setting.anchor) != null ? _setting_anchor : [
+            0.5,
+            0.5
+        ];
+        this._setupSpaceGlyphs(font, setting);
+        //the metrics for this text layout
+        this._width = maxLineWidth;
+        this._height = height;
+        this._descender = descender;
+        this._baseline = baseline;
+        this._xHeight = getXHeight(font);
+        this._capHeight = getCapHeight(font);
+        this._lineHeight = lineHeight;
+        this._ascender = baseline - this._xHeight; //lineHeight - descender - this._xHeight
+        const anchorOffset = [
+            -maxLineWidth * anchor[0],
+            2 * lineHeight * anchor[1] - baseline
+        ];
+        let x = 0, y = 0;
+        //draw text along baseline
+        y -= height;
+        glyphs.length = 0;
+        for(let k = 0; k < lines.length; k++){
+            const line = lines[k];
+            let start = line.start;
+            let end = line.end;
+            let lineWidth = line.width;
+            let lastGlyph;
+            //for each glyph in that line...
+            for(let i = start; i < end; i++){
+                let id = text.charCodeAt(i);
+                let glyph = this._getGlyph(font, id);
+                if (glyph) {
+                    if (lastGlyph) x += getKerning(font, lastGlyph.id, glyph.id);
+                    let tx = x;
+                    if (align === ALIGN_CENTER) tx += (maxLineWidth - lineWidth) / 2;
+                    else if (align === ALIGN_RIGHT) tx += maxLineWidth - lineWidth;
+                    glyphs.push({
+                        position: [
+                            tx + anchorOffset[0],
+                            y + anchorOffset[1]
+                        ],
+                        data: glyph,
+                        index: i,
+                        line: k
+                    });
+                    //move pen forward
+                    x += glyph.xadvance + letterSpacing;
+                    lastGlyph = glyph;
+                }
+            }
+            //next line down
+            y += lineHeight;
+            x = 0;
+        }
+        this._linesTotal = lines.length;
+    }
+    _setupSpaceGlyphs(font, setting) {
+        //These are fallbacks, when the font doesn't include
+        //' ' or '\t' glyphs
+        if (!font.chars || font.chars.length === 0) return;
+        //try to get space glyph
+        //then fall back to the 'm' or 'w' glyphs
+        //then fall back to the first glyph available
+        const space = Object.assign({}, getGlyphById(font, SPACE_ID) || getMGlyph(font) || font.chars[0]);
+        //and create a fallback for tab
+        const tabWidth = setting.tabSize * space.xadvance;
+        this._fallbackSpaceGlyph = space;
+        this._fallbackTabGlyph = Object.assign(space, {
+            x: 0,
+            y: 0,
+            xadvance: tabWidth,
+            id: TAB_ID,
+            xoffset: 0,
+            yoffset: 0,
+            width: 0,
+            height: 0
+        });
+    }
+    _getGlyph(font, id) {
+        let glyph = getGlyphById(font, id);
+        if (glyph) return glyph;
+        else if (id === TAB_ID) return this._fallbackTabGlyph;
+        else if (id === SPACE_ID) return this._fallbackSpaceGlyph;
+        return null;
+    }
+    _computeMetrics(text, start, end, width, letterSpacing = 0) {
+        let font = this._font;
+        let curPen = 0;
+        let curWidth = 0;
+        let count = 0;
+        let lastGlyph;
+        if (!font.chars || font.chars.length === 0) {
+            return {
+                start: start,
+                end: start,
+                width: 0
+            };
+        }
+        end = Math.min(text.length, end);
+        for(let i = start; i < end; i++){
+            let id = text.charCodeAt(i);
+            let glyph = this._getGlyph(font, id);
+            if (glyph) {
+                //move pen forward
+                glyph.xoffset;
+                let kern = lastGlyph ? getKerning(font, lastGlyph.id, glyph.id) : 0;
+                curPen += kern;
+                let nextPen = curPen + glyph.xadvance + letterSpacing;
+                let nextWidth = curPen + glyph.width;
+                //we've hit our limit; we can't move onto the next glyph
+                if (nextWidth >= width || nextPen >= width) break;
+                //otherwise continue along our line
+                curPen = nextPen;
+                curWidth = nextWidth;
+                lastGlyph = glyph;
+            }
+            count++;
+        }
+        //make sure rightmost edge lines up with rendered glyphs
+        if (lastGlyph) curWidth += lastGlyph.xoffset;
+        return {
+            start: start,
+            end: start + count,
+            width: curWidth
+        };
+    }
+    constructor(){
+        this._width = 0;
+        this._height = 0;
+        this._descender = 0;
+        this._ascender = 0;
+        this._xHeight = 0;
+        this._baseline = 0;
+        this._capHeight = 0;
+        this._lineHeight = 0;
+        this._linesTotal = 0;
+        this._glyphs = [];
+        this._fallbackSpaceGlyph = null;
+        this._fallbackTabGlyph = null;
+        this._font = null;
+    }
+}
+
+const itemSize = 2;
+const box = {
+    min: [
+        0,
+        0
+    ],
+    max: [
+        0,
+        0
+    ]
+};
+function bounds(positions) {
+    const count = positions.length / itemSize;
+    box.min[0] = positions[0];
+    box.min[1] = positions[1];
+    box.max[0] = positions[0];
+    box.max[1] = positions[1];
+    for(let i = 0; i < count; i++){
+        const x = positions[i * itemSize + 0];
+        const y = positions[i * itemSize + 1];
+        box.min[0] = Math.min(x, box.min[0]);
+        box.min[1] = Math.min(y, box.min[1]);
+        box.max[0] = Math.max(x, box.max[0]);
+        box.max[1] = Math.max(y, box.max[1]);
+    }
+}
+function computeBox(positions, output) {
+    bounds(positions);
+    output.min.set(box.min[0], box.min[1], 0);
+    output.max.set(box.max[0], box.max[1], 0);
+}
+function computeSphere(positions, output) {
+    bounds(positions);
+    const minX = box.min[0];
+    const minY = box.min[1];
+    const maxX = box.max[0];
+    const maxY = box.max[1];
+    const width = maxX - minX;
+    const height = maxY - minY;
+    const length = Math.sqrt(width * width + height * height);
+    output.center.set(minX + width / 2, minY + height / 2, 0);
+    output.radius = length / 2;
+}
+
+class BMFontTextGeometry extends THREE.BufferGeometry {
+    update(fontAtlas, text, setting) {
+        this.layout.update(fontAtlas.info, text, setting);
+        const { indice, position, uv } = fontAtlas.build(this.layout, setting);
+        this.setIndex(new THREE.BufferAttribute(indice, 1));
+        this.setAttribute("position", new THREE.BufferAttribute(position, 2));
+        this.setAttribute("uv", new THREE.BufferAttribute(uv, 2));
+    }
+    computeBoundingSphere() {
+        if (this.boundingSphere === null) {
+            this.boundingSphere = new THREE.Sphere();
+        }
+        const positions = this.attributes.position.array;
+        const itemSize = this.attributes.position.itemSize;
+        if (!positions || !itemSize || positions.length < 2) {
+            this.boundingSphere.radius = 0;
+            this.boundingSphere.center.set(0, 0, 0);
+            return;
+        }
+        computeSphere(positions, this.boundingSphere);
+        if (isNaN(this.boundingSphere.radius)) {
+            console.error('THREE.BufferGeometry.computeBoundingSphere(): ' + 'Computed radius is NaN. The ' + '"position" attribute is likely to have NaN values.');
+        }
+    }
+    computeBoundingBox() {
+        if (this.boundingBox === null) {
+            this.boundingBox = new THREE.Box3();
+        }
+        const bbox = this.boundingBox;
+        const positions = this.attributes.position["array"];
+        const itemSize = this.attributes.position.itemSize;
+        if (!positions || !itemSize || positions.length < 2) {
+            bbox.makeEmpty();
+            return;
+        }
+        computeBox(positions, bbox);
+    }
+    constructor(...args){
+        super(...args), this.layout = new BMFontTextLayout();
+    }
+}
+
+class Label extends Component {
+    get text() {
+        return this._text;
+    }
+    set text(v) {
+        if (this._text !== v) {
+            this._text = v;
+            this.needsUpdate = true;
+        }
+    }
+    get font() {
+        return this._font;
+    }
+    set font(v) {
+        if (this._font !== v) {
+            this._font = v;
+            this.needsUpdate = true;
+        }
+    }
+    get setting() {
+        return this._setting;
+    }
+    set setting(v) {
+        if (JSON.stringify(this._setting) !== JSON.stringify(v)) {
+            this._setting = v;
+            this.needsUpdate = true;
+        }
+    }
+    get layout() {
+        return this.node.geometry.layout;
+    }
+    forceUpdate() {
+        this.node.geometry.update(this.font, this.text, this.setting);
+    }
+    update(dt) {
+        if (this.needsUpdate) {
+            this.needsUpdate = false;
+            this.forceUpdate();
+        }
+    }
+    constructor({ text = "", font, material, ...setting }){
+        super(), this.needsUpdate = false, this._text = "", this._font = null, this._setting = null;
+        this.text = text;
+        this.font = font;
+        this.setting = setting;
+        this.node = new THREE.Mesh(new BMFontTextGeometry(), material || font.material);
+        this.node.geometry.update(this.font, this.text, this.setting);
+    }
+}
+
+const vert_MSDF = `
+varying vec2 v_uv;
+
+void main() {
+    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+    v_uv = uv;
+}
+`;
+const frag_MSDF = `
+uniform sampler2D u_fontTexture;
+varying vec2  v_uv;
+
+uniform vec3  u_color;
+uniform float u_opacity;
+uniform vec3  u_strokeColor;
+uniform float u_strokeWidth;
+uniform vec3  u_shadowColor;
+uniform float u_shadowBlur;
+uniform vec2  u_shadowOffset;
+uniform float u_weight;
+
+float median(in float r, in float g, in float b) {
+    return max(min(r, g), min(max(r, g), b));
+}
+
+float signedDistance(in vec2 uv) {
+    vec4 texel = texture2D(u_fontTexture, uv);
+    return median(texel.r, texel.g, texel.b) - 0.5;
+}
+
+void main() {
+    vec4  color = vec4(u_color, 1.);
+    float d = signedDistance(v_uv) + u_weight;
+    float w = fwidth(d);
+
+    vec4 stroke = vec4(u_strokeColor, smoothstep(-w, w, d));
+    color.a *= smoothstep(-w, w, d - u_strokeWidth);
+    color = mix(stroke, color, color.a);
+
+    float sd = signedDistance(v_uv + u_shadowOffset) + u_weight;
+    vec4  shadow = vec4(u_shadowColor, smoothstep(-w - u_shadowBlur, w + u_shadowBlur, sd));
+    color = mix(shadow, color, color.a);
+
+    color.a *= u_opacity;
+    gl_FragColor = color;
+}
+`;
+class BMFontAtlas {
+    build(layout, setting) {
+        const info = this.info;
+        const texWidth = info.common.scaleW;
+        const texHeight = info.common.scaleH;
+        const glyphs = layout.glyphs.filter((glyph)=>glyph.data.width * glyph.data.height > 0);
+        const flipY = setting.flipY !== false;
+        const position = new Float32Array(glyphs.length * 8);
+        const uv = new Float32Array(glyphs.length * 8);
+        const indice = new Uint16Array(glyphs.length * 6);
+        for(let k = 0, i0 = 0, i1 = 0, i2 = 0, i = 0; i < glyphs.length; i++, k += 4){
+            const glyph = glyphs[i];
+            const bitmap = glyph.data;
+            // bottom left position
+            let x = glyph.position[0] + bitmap.xoffset;
+            let y = glyph.position[1] + bitmap.yoffset;
+            // quad size
+            let w = bitmap.width;
+            let h = bitmap.height;
+            // BL
+            position[i0++] = x;
+            position[i0++] = y;
+            // BR
+            position[i0++] = x + w;
+            position[i0++] = y;
+            // TR
+            position[i0++] = x + w;
+            position[i0++] = y + h;
+            // TL
+            position[i0++] = x;
+            position[i0++] = y + h;
+            let bw = bitmap.x + bitmap.width;
+            let bh = bitmap.y + bitmap.height;
+            // top left position
+            let u0 = bitmap.x / texWidth;
+            let v0 = bitmap.y / texHeight;
+            let u1 = bw / texWidth;
+            let v1 = bh / texHeight;
+            if (flipY) {
+                v0 = 1 - v0;
+                v1 = 1 - v1;
+            }
+            // BL
+            uv[i1++] = u0;
+            uv[i1++] = v0;
+            // BR
+            uv[i1++] = u1;
+            uv[i1++] = v0;
+            // TR
+            uv[i1++] = u1;
+            uv[i1++] = v1;
+            // TL
+            uv[i1++] = u0;
+            uv[i1++] = v1;
+            indice[i2++] = k + 0;
+            indice[i2++] = k + 1;
+            indice[i2++] = k + 2;
+            indice[i2++] = k + 0;
+            indice[i2++] = k + 2;
+            indice[i2++] = k + 3;
+        }
+        return {
+            position,
+            uv,
+            indice
+        };
+    }
+    constructor({ info, texture, uniforms, ...props }){
+        this.uniforms = {
+            u_color: {
+                value: new THREE.Color(0xffffff)
+            },
+            u_opacity: {
+                value: 1
+            },
+            u_weight: {
+                value: 0.2
+            },
+            u_strokeColor: {
+                value: new THREE.Color(0xff0000)
+            },
+            u_strokeWidth: {
+                value: 0
+            },
+            u_shadowColor: {
+                value: new THREE.Color(0xff0000)
+            },
+            u_shadowBlur: {
+                value: 0
+            },
+            u_shadowOffset: {
+                value: new THREE.Vector2()
+            },
+            u_fontTexture: {
+                value: null
+            }
+        };
+        this.info = info;
+        this.uniforms.u_fontTexture.value = texture;
+        this.material = new THREE.ShaderMaterial(Object.assign({
+            vertexShader: vert_MSDF,
+            fragmentShader: frag_MSDF,
+            transparent: true,
+            depthWrite: false,
+            blending: THREE.NormalBlending,
+            uniforms: {
+                ...this.uniforms,
+                ...uniforms
+            }
+        }, props));
+    }
+}
+
 exports.AccumulativeShadows = AccumulativeShadows;
 exports.Animation = Animation;
 exports.AnimationCurve = AnimationCurve;
 exports.BINLoader = BINLoader;
+exports.BMFontAtlas = BMFontAtlas;
+exports.BMFontTextGeometry = BMFontTextGeometry;
+exports.BMFontTextLayout = BMFontTextLayout;
 exports.Box = Box;
 exports.BoxProjection = BoxProjection;
 exports.Center = Center;
@@ -5913,6 +6628,7 @@ exports.GLTFLoader = GLTFLoader;
 exports.HDRLoader = HDRLoader;
 exports.JSONLoader = JSONLoader;
 exports.KTX2Loader = KTX2Loader;
+exports.Label = Label;
 exports.Loader = Loader;
 exports.Logger = Logger;
 exports.ObjectInstance = ObjectInstance;