three-base 2.0.115 → 2.0.116

package/ExtrudeMesh.d.ts

@@ -34,6 +34,7 @@ export default class ExtrudeMesh extends Mesh<BufferGeometry, Material> {
     static temp2Matrix4: Matrix4;
     static temp3Matrix4: Matrix4;
     constructor(props: ExtrudeMeshProps, material?: Material);
+    shapePathWidth: number;
     pointerWidthRadius: Array<{
         vector3: [number, number, number];
         matrix: [

package/ExtrudeMesh.js

@@ -2,7 +2,7 @@
  * @Author: xiaosihan
  * @Date: 2022-06-08 14:20:52
  * @Last Modified by: xiaosihan
- * @Last Modified time: 2022-09-30 00:12:19
+ * @Last Modified time: 2025-01-17 20:42:22
  */
 import { clamp, cloneDeep, filter, first, get, isNumber, last } from "lodash";
 import { BufferAttribute, BufferGeometry, Matrix4, Mesh, Vector2, Vector3 } from "three";
@@ -32,6 +32,8 @@ export default class ExtrudeMesh extends Mesh {
         super(undefined, material);
         this.updateGeometry(props);
     }
+    //宽度
+    shapePathWidth = 1;
     // 通过 props.paths 和圆角属性 计算出来的 最终路径
     pointerWidthRadius = [];
     // 通过2个顶点和缩放值计算矩阵
@@ -155,16 +157,16 @@ export default class ExtrudeMesh extends Mesh {
                             .toArray()
                     });
                 }
-                else if (segments === 0) { // 分段数为0时不分段
+                else if (segments === 0) { // 分段数为0时不分段 并在前后各加一个点
                     let { x = 1, y = 1 } = scale;
                     this.pointerWidthRadius.push({
                         vector3,
-                        matrix: this.computerMatrix((v2Inv1Left ? circleCenter.toArray() : vector3), (v2Inv1Left ? vector3 : circleCenter.toArray()), [1, y, x])
+                        matrix: this.computerMatrix((v2Inv1Left ? circleCenter.toArray() : vector3), (v2Inv1Left ? vector3 : circleCenter.toArray()), [1, y, x / Math.sin(innerAngle / 2)])
                     });
                 }
                 else {
                     for (let ii = 0; ii <= segments; ii++) {
-                        // 圆角计算的低n个点的角度
+                        // 圆角计算的第n个点的角度
                         let Aa = ii * ((Math.PI - innerAngle) / segments);
                         //半径对角
                         let Cc = Math.PI - Aa - (innerAngle / 2);
@@ -330,6 +332,7 @@ export default class ExtrudeMesh extends Mesh {
     //设置模型
     updateGeometry(props) {
         const { paths, shapePath, closed } = props;
+        this.shapePathWidth = Math.max(...shapePath.map(path => path[0])) - Math.min(...shapePath.map(path => path[0]));
         // 计算圆角路径
         this.computerPointerWidthRadius(paths, closed);
         //网格模型的每个顶点位置

package/ThreeBase.d.ts

@@ -69,6 +69,7 @@ export default class ThreeBase extends EventDispatcher {
     autoRender: boolean;
     needRender: boolean;
     stopRender(): void;
+    hasPass(): boolean;
     render(): void;
     private renderBindThis;
     getThumbBlob(): Promise<Blob>;

package/ThreeBase.js

@@ -2,7 +2,7 @@
  * @Author: xiaosihan
  * @Date: 2021-12-20 13:38:22
  * @Last Modified by: xiaosihan
- * @Last Modified time: 2025-01-17 06:49:44
+ * @Last Modified time: 2025-01-17 11:07:38
  */
 import { round } from "lodash";
 import { AxesHelper, Box3, DepthFormat, DepthTexture, EventDispatcher, GridHelper, LinearFilter, MOUSE, NoBlending, NormalBlending, OrthographicCamera, PerspectiveCamera, RGBAFormat, ReinhardToneMapping, SRGBColorSpace, Scene, TOUCH, UnsignedShortType, Vector2, Vector3, WebGLRenderTarget, WebGLRenderer, } from "three";
@@ -10,13 +10,14 @@ import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
 import { degToRad, generateUUID } from "three/src/math/MathUtils";
 import ThreeMouse from "./ThreeMouse";
 import Transition from "./Transition";
+import bloom_pass from "./pass/bloom_pass";
+import cover_pass from "./pass/cover_pass";
 import glow_pass from "./pass/glow_pass";
 import stroke_pass from "./pass/stroke_pass";
-import { baseTextureToRenderShader, copyShader, fullScreenMesh, } from "./shaders";
+import { copyShader, fullScreenMesh } from "./shaders";
+import { baseTextureToRenderShader } from "./shaders/baseTextureToRenderShader";
 import threeLoader from "./threeLoader";
 import threeUtils from "./threeUtils";
-import cover_pass from "./pass/cover_pass";
-import bloom_pass from "./pass/bloom_pass";
 // three.js 的基础对象
 export default class ThreeBase extends EventDispatcher {
     constructor() {
@@ -193,7 +194,7 @@ export default class ThreeBase extends EventDispatcher {
         this.renderer.setPixelRatio(window.devicePixelRatio);
         this.renderer.setSize(width, height);
         // 设置帧缓存区的尺寸
-        this.baseRenderTarget.setSize(width * Math.max(2, window.devicePixelRatio), height * Math.max(2, window.devicePixelRatio));
+        this.baseRenderTarget.setSize(width * window.devicePixelRatio, height * window.devicePixelRatio);
         // 设置深度纹理的尺寸
         this.baseDepthTexture.image.width = width * window.devicePixelRatio;
         this.baseDepthTexture.image.height = height * window.devicePixelRatio;
@@ -427,6 +428,23 @@ export default class ThreeBase extends EventDispatcher {
             this.renderer.domElement.style.opacity = "0";
         }
     }
+    //判断是否有特效
+    hasPass() {
+        let hasPass = false;
+        this.scene.traverseVisible((obj) => {
+            const { stroke_enable = false, stroke_width = 1, glow_enable = false, glow_width = 1, cover_enable = false, cover_opacity = 1, } = obj.userData;
+            if (stroke_enable && stroke_width > 0) {
+                hasPass = true;
+            }
+            if (glow_enable && glow_width > 0) {
+                hasPass = true;
+            }
+            if (cover_enable && cover_opacity > 0) {
+                hasPass = true;
+            }
+        });
+        return hasPass;
+    }
     // 渲染场景
     render() {
         // canvas 没有在页面上面的话 就停止渲染
@@ -479,21 +497,31 @@ export default class ThreeBase extends EventDispatcher {
         }
         // 渲染场景
         this.dispatchEvent({ type: "beforeRender" });
+        const hasPass = this.hasPass();
         // 把基础场景渲染到 帧缓冲区 在后期通道中会用到
-        this.renderer.setRenderTarget(this.baseRenderTarget);
-        this.renderer.clear();
-        this.renderer.render(this.scene, camera);
-        this.renderer.setRenderTarget(null);
-        this.renderer.clear();
-        this.renderRendererTarget(this.baseRenderTarget);
-        // 后处理特效渲染(描边,发光,颜色覆盖,磨砂玻璃,bloom)
-        this.scene.traverseVisible((obj) => {
-            stroke_pass(this.renderer, camera, obj, this.baseDepthTexture);
-            glow_pass(this.renderer, camera, obj, this.baseDepthTexture);
-            cover_pass(this.renderer, camera, obj, this.baseDepthTexture);
-        });
-        //后处理发光特效
-        bloom_pass(this.renderer, camera, this.scene, this.baseDepthTexture);
+        if (hasPass) {
+            this.renderer.setRenderTarget(this.baseRenderTarget);
+            this.renderer.clear();
+            this.renderer.render(this.scene, camera);
+            // 后处理特效渲染(描边,发光,颜色覆盖,磨砂玻璃,bloom)
+            this.scene.traverseVisible((obj) => {
+                stroke_pass(this.renderer, camera, obj, this.baseDepthTexture);
+                glow_pass(this.renderer, camera, obj, this.baseDepthTexture);
+            });
+            this.renderer.setRenderTarget(null);
+            this.renderer.clear();
+            this.renderRendererTarget(this.baseRenderTarget);
+            this.scene.traverseVisible((obj) => {
+                cover_pass(this.renderer, camera, obj, this.baseDepthTexture);
+            });
+            //后处理发光特效
+            bloom_pass(this.renderer, camera, this.scene, this.baseDepthTexture);
+        }
+        else {
+            this.renderer.setRenderTarget(null);
+            this.renderer.clear();
+            this.renderer.render(this.scene, camera);
+        }
         this.dispatchEvent({ type: "afterRender" });
     }
     renderBindThis = this.render.bind(this);
@@ -540,8 +568,8 @@ export default class ThreeBase extends EventDispatcher {
     }
     //把渲染目标渲染到canvas上
     renderRendererTarget(renderTarget) {
-        baseTextureToRenderShader.uniforms.map.value = renderTarget.texture;
-        baseTextureToRenderShader.uniforms.opacity.value = 1.0;
+        baseTextureToRenderShader.uniforms.resolution.value.set(1 / this.size.x, 1 / this.size.y);
+        baseTextureToRenderShader.uniforms.tDiffuse.value = renderTarget.texture;
         fullScreenMesh.render(this.renderer, baseTextureToRenderShader);
     }
     // 渲染纹理

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-base",
-  "version": "2.0.115",
+  "version": "2.0.116",
   "description": "three 3d three-base",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/pass/glow_pass.js

@@ -556,14 +556,12 @@ export default function glow_pass(renderer, camera, object3d, baseDepthTexture)
     blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
     blurShader.uniforms.opacity.value = 0.1;
     fsQuad.render(renderer, blurShader);
-    //最后抗锯齿
     renderer.setRenderTarget(blur1TextureTarget);
-    FXAAShaderMaterial.uniforms.tDiffuse.value = blur2TextureTarget.texture;
-    fsQuad.render(renderer, FXAAShaderMaterial);
+    copyShader.uniforms.map.value = blur2TextureTarget.texture;
+    fsQuad.render(renderer, copyShader);
     // 还原帧缓冲区 减去原始纹理保留描边
     renderer.setRenderTarget(originRenderTarget);
-    filterSelectShader.uniforms.selectTexture.value =
-        selectDethpTestTextureTarget.texture;
+    filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;
     filterSelectShader.uniforms.blurTexture.value = blur1TextureTarget.texture;
     filterSelectShader.uniforms.opacity.value = glow_opacity;
     filterSelectShader.blending = NormalBlending; // 与有的纹理融合计算 保留前面通道传递下来的纹理

package/pass/stroke_pass.js

@@ -314,7 +314,7 @@ const FXAAShaderMaterial = new ShaderMaterial({
     transparent: true
 });
 // 描边着色器
-const blurShader = new RawShaderMaterial({
+const strokeShader = new RawShaderMaterial({
     uniforms: {
         tDiffuse: { value: null },
         color: { value: new Color("#0f0") },
@@ -483,12 +483,12 @@ export default function stroke_pass(renderer, camera, object3d, baseDepthTexture
     renderer.clear();
     renderer.render(scene, camera);
     // 设置描边着色器的分辨率
-    blurShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
+    strokeShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
     // 设置抗锯齿着色器的分辨率
     FXAAShaderMaterial.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
     //描边颜色
-    blurShader.uniforms.color.value.set(stroke_color);
-    blurShader.uniforms.width.value = 1;
+    strokeShader.uniforms.color.value.set(stroke_color);
+    strokeShader.uniforms.width.value = 1;
     //深度测试
     renderer.setRenderTarget(selectDethpTestTextureTarget);
     renderer.clear();
@@ -498,26 +498,25 @@ export default function stroke_pass(renderer, camera, object3d, baseDepthTexture
     fsQuad.render(renderer, depthTestShader);
     //一次描边
     renderer.setRenderTarget(blur1TextureTarget);
-    blurShader.uniforms.tDiffuse.value = selectDethpTestTextureTarget.texture;
-    fsQuad.render(renderer, blurShader);
+    strokeShader.uniforms.tDiffuse.value = selectDethpTestTextureTarget.texture;
+    fsQuad.render(renderer, strokeShader);
     //二次描边
     renderer.setRenderTarget(blur2TextureTarget);
-    blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
-    fsQuad.render(renderer, blurShader);
+    strokeShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
+    fsQuad.render(renderer, strokeShader);
     for (let i = 0; i < stroke_width - 2; i++) {
         //一次描边
         renderer.setRenderTarget(blur1TextureTarget);
-        blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
-        fsQuad.render(renderer, blurShader);
+        strokeShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
+        fsQuad.render(renderer, strokeShader);
         //二次描边
         renderer.setRenderTarget(blur2TextureTarget);
-        blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
-        fsQuad.render(renderer, blurShader);
+        strokeShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
+        fsQuad.render(renderer, strokeShader);
     }
-    //最后抗锯齿
     renderer.setRenderTarget(blur1TextureTarget);
-    FXAAShaderMaterial.uniforms.tDiffuse.value = blur2TextureTarget.texture;
-    fsQuad.render(renderer, FXAAShaderMaterial);
+    copyShader.uniforms.map.value = blur2TextureTarget.texture;
+    fsQuad.render(renderer, copyShader);
     // 还原帧缓冲区 减去原始纹理保留描边
     renderer.setRenderTarget(originRenderTarget);
     filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;

package/shaders/baseTextureToRenderShader.d.ts

@@ -0,0 +1,2 @@
+import { ShaderMaterial } from "three";
+export declare const baseTextureToRenderShader: ShaderMaterial;

package/shaders/baseTextureToRenderShader.js

@@ -0,0 +1,237 @@
+import { ShaderMaterial, Vector2, ShaderChunk, NoBlending } from "three";
+// 渲染目标绘制到渲染器着色器
+export const baseTextureToRenderShader = new ShaderMaterial({
+    uniforms: {
+        tDiffuse: { value: null },
+        resolution: { value: new Vector2(1 / 1024, 1 / 1024) }
+    },
+    vertexShader: `
+        ${ShaderChunk.common}
+        ${ShaderChunk.logdepthbuf_pars_vertex}
+        varying vec2 vUv;
+        void main() {
+            vUv = uv;
+            gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+            ${ShaderChunk.logdepthbuf_vertex}
+        }
+    `,
+    fragmentShader: `
+        ${ShaderChunk.logdepthbuf_pars_fragment}
+        precision highp float;
+
+        uniform sampler2D tDiffuse;
+    
+        uniform vec2 resolution;
+    
+        varying vec2 vUv;
+    
+        #ifndef FXAA_DISCARD
+                //
+                // Only valid for PC OpenGL currently.
+                // Probably will not work when FXAA_GREEN_AS_LUMA = 1.
+                //
+                // 1 = Use discard on pixels which don't need AA.
+                //     For APIs which enable concurrent TEX+ROP from same surface.
+                // 0 = Return unchanged color on pixels which don't need AA.
+                //
+                #define FXAA_DISCARD 0
+        #endif
+    
+        /*--------------------------------------------------------------------------*/
+        #define FxaaTexTop(t, p) texture2D(t, p, -100.0)
+        #define FxaaTexOff(t, p, o, r) texture2D(t, p + (o * r), -100.0)
+        /*--------------------------------------------------------------------------*/
+    
+        #define NUM_SAMPLES 5
+    
+        // assumes colors have premultipliedAlpha, so that the calculated color contrast is scaled by alpha
+        float contrast( vec4 a, vec4 b ) {
+                vec4 diff = abs( a - b );
+                return max( max( max( diff.r, diff.g ), diff.b ), diff.a );
+        }
+    
+        /*============================================================================
+    
+                                        FXAA3 QUALITY - PC
+    
+        ============================================================================*/
+    
+        /*--------------------------------------------------------------------------*/
+        vec4 FxaaPixelShader(
+                vec2 posM,
+                sampler2D tex,
+                vec2 fxaaQualityRcpFrame,
+                float fxaaQualityEdgeThreshold,
+                float fxaaQualityinvEdgeThreshold
+        ) {
+                vec4 rgbaM = FxaaTexTop(tex, posM);
+                vec4 rgbaS = FxaaTexOff(tex, posM, vec2( 0.0, 1.0), fxaaQualityRcpFrame.xy);
+                vec4 rgbaE = FxaaTexOff(tex, posM, vec2( 1.0, 0.0), fxaaQualityRcpFrame.xy);
+                vec4 rgbaN = FxaaTexOff(tex, posM, vec2( 0.0,-1.0), fxaaQualityRcpFrame.xy);
+                vec4 rgbaW = FxaaTexOff(tex, posM, vec2(-1.0, 0.0), fxaaQualityRcpFrame.xy);
+                // . S .
+                // W M E
+                // . N .
+    
+                bool earlyExit = max( max( max(
+                        contrast( rgbaM, rgbaN ),
+                        contrast( rgbaM, rgbaS ) ),
+                        contrast( rgbaM, rgbaE ) ),
+                        contrast( rgbaM, rgbaW ) )
+                        < fxaaQualityEdgeThreshold;
+                // . 0 .
+                // 0 0 0
+                // . 0 .
+    
+                #if (FXAA_DISCARD == 1)
+                        if(earlyExit) FxaaDiscard;
+                #else
+                        if(earlyExit) return rgbaM;
+                #endif
+    
+                float contrastN = contrast( rgbaM, rgbaN );
+                float contrastS = contrast( rgbaM, rgbaS );
+                float contrastE = contrast( rgbaM, rgbaE );
+                float contrastW = contrast( rgbaM, rgbaW );
+    
+                float relativeVContrast = ( contrastN + contrastS ) - ( contrastE + contrastW );
+                relativeVContrast *= fxaaQualityinvEdgeThreshold;
+    
+                bool horzSpan = relativeVContrast > 0.;
+                // . 1 .
+                // 0 0 0
+                // . 1 .
+    
+                // 45 deg edge detection and corners of objects, aka V/H contrast is too similar
+                if( abs( relativeVContrast ) < .3 ) {
+                        // locate the edge
+                        vec2 dirToEdge;
+                        dirToEdge.x = contrastE > contrastW ? 1. : -1.;
+                        dirToEdge.y = contrastS > contrastN ? 1. : -1.;
+                        // . 2 .      . 1 .
+                        // 1 0 2  ~=  0 0 1
+                        // . 1 .      . 0 .
+    
+                        // tap 2 pixels and see which ones are "outside" the edge, to
+                        // determine if the edge is vertical or horizontal
+    
+                        vec4 rgbaAlongH = FxaaTexOff(tex, posM, vec2( dirToEdge.x, -dirToEdge.y ), fxaaQualityRcpFrame.xy);
+                        float matchAlongH = contrast( rgbaM, rgbaAlongH );
+                        // . 1 .
+                        // 0 0 1
+                        // . 0 H
+    
+                        vec4 rgbaAlongV = FxaaTexOff(tex, posM, vec2( -dirToEdge.x, dirToEdge.y ), fxaaQualityRcpFrame.xy);
+                        float matchAlongV = contrast( rgbaM, rgbaAlongV );
+                        // V 1 .
+                        // 0 0 1
+                        // . 0 .
+    
+                        relativeVContrast = matchAlongV - matchAlongH;
+                        relativeVContrast *= fxaaQualityinvEdgeThreshold;
+    
+                        if( abs( relativeVContrast ) < .3 ) { // 45 deg edge
+                                // 1 1 .
+                                // 0 0 1
+                                // . 0 1
+    
+                                // do a simple blur
+                                return mix(
+                                        rgbaM,
+                                        (rgbaN + rgbaS + rgbaE + rgbaW) * .25,
+                                        .4
+                                );
+                        }
+    
+                        horzSpan = relativeVContrast > 0.;
+                }
+    
+                if(!horzSpan) rgbaN = rgbaW;
+                if(!horzSpan) rgbaS = rgbaE;
+                // . 0 .      1
+                // 1 0 1  ->  0
+                // . 0 .      1
+    
+                bool pairN = contrast( rgbaM, rgbaN ) > contrast( rgbaM, rgbaS );
+                if(!pairN) rgbaN = rgbaS;
+    
+                vec2 offNP;
+                offNP.x = (!horzSpan) ? 0.0 : fxaaQualityRcpFrame.x;
+                offNP.y = ( horzSpan) ? 0.0 : fxaaQualityRcpFrame.y;
+    
+                bool doneN = false;
+                bool doneP = false;
+    
+                float nDist = 0.;
+                float pDist = 0.;
+    
+                vec2 posN = posM;
+                vec2 posP = posM;
+    
+                int iterationsUsed = 0;
+                int iterationsUsedN = 0;
+                int iterationsUsedP = 0;
+                for( int i = 0; i < NUM_SAMPLES; i++ ) {
+                        iterationsUsed = i;
+    
+                        float increment = float(i + 1);
+    
+                        if(!doneN) {
+                                nDist += increment;
+                                posN = posM + offNP * nDist;
+                                vec4 rgbaEndN = FxaaTexTop(tex, posN.xy);
+                                doneN = contrast( rgbaEndN, rgbaM ) > contrast( rgbaEndN, rgbaN );
+                                iterationsUsedN = i;
+                        }
+    
+                        if(!doneP) {
+                                pDist += increment;
+                                posP = posM - offNP * pDist;
+                                vec4 rgbaEndP = FxaaTexTop(tex, posP.xy);
+                                doneP = contrast( rgbaEndP, rgbaM ) > contrast( rgbaEndP, rgbaN );
+                                iterationsUsedP = i;
+                        }
+    
+                        if(doneN || doneP) break;
+                }
+    
+    
+                if ( !doneP && !doneN ) return rgbaM; // failed to find end of edge
+    
+                float dist = min(
+                        doneN ? float( iterationsUsedN ) / float( NUM_SAMPLES - 1 ) : 1.,
+                        doneP ? float( iterationsUsedP ) / float( NUM_SAMPLES - 1 ) : 1.
+                );
+    
+                // hacky way of reduces blurriness of mostly diagonal edges
+                // but reduces AA quality
+                dist = pow(dist, .5);
+    
+                dist = 1. - dist;
+    
+                return mix(
+                        rgbaM,
+                        rgbaN,
+                        dist * .5
+                );
+        }
+    
+        void main() {
+                const float edgeDetectionQuality = .2;
+                const float invEdgeDetectionQuality = 1. / edgeDetectionQuality;
+    
+                gl_FragColor = sRGBTransferOETF(FxaaPixelShader(
+                        vUv,
+                        tDiffuse,
+                        resolution,
+                        edgeDetectionQuality, // [0,1] contrast needed, otherwise early discard
+                        invEdgeDetectionQuality
+                ));
+            ${ShaderChunk.logdepthbuf_fragment}
+        }
+    `,
+    blending: NoBlending,
+    depthTest: false,
+    depthWrite: false,
+    transparent: true
+});

package/shaders.d.ts

@@ -5,6 +5,3 @@ export declare const orthographicCamera: OrthographicCamera;
 export declare const clearShader: ShaderMaterial;
 export declare const intersectionShader: ShaderMaterial;
 export declare const copyShader: ShaderMaterial;
-export declare const baseTextureToRenderShader: ShaderMaterial;
-export declare const strokeShader: ShaderMaterial;
-export declare const gaussBlurShader: ShaderMaterial;

package/shaders.js

@@ -4,7 +4,7 @@
  * @Last Modified by: xiaosihan
  * @Last Modified time: 2022-04-02 18:28:38
  */
-import { Color, NoBlending, OrthographicCamera, ShaderChunk, ShaderMaterial, Vector2 } from "three";
+import { NoBlending, OrthographicCamera, ShaderChunk, ShaderMaterial } from "three";
 import FullScreenQuad from "./pass/FullScreenQuad";
 // 常用着色器及工具
 // 全屏渲染模型
@@ -95,163 +95,3 @@ export const copyShader = new ShaderMaterial({
     depthWrite: true,
     transparent: true,
 });
-// 渲染目标绘制到渲染器着色器
-export const baseTextureToRenderShader = new ShaderMaterial({
-    uniforms: {
-        map: { value: null },
-        opacity: { value: 1.0 }, // 透明度
-    },
-    vertexShader: `
-        ${ShaderChunk.common}
-        ${ShaderChunk.logdepthbuf_pars_vertex}
-        varying vec2 vUv;
-        void main() {
-            vUv = uv;
-            gl_Position = vec4(position, 1.0);
-            ${ShaderChunk.logdepthbuf_vertex}
-        }
-    `,
-    fragmentShader: `
-    ${ShaderChunk.logdepthbuf_pars_fragment}
-    uniform sampler2D map;
-    uniform float opacity;
-    varying vec2 vUv;
-    void main() {
-        gl_FragColor = sRGBTransferOETF(texture(map, vUv));
-        ${ShaderChunk.logdepthbuf_fragment}
-    }
-`,
-    depthTest: true,
-    depthWrite: true,
-    transparent: true,
-});
-// 描边着色器
-export const strokeShader = new ShaderMaterial({
-    uniforms: {
-        map: { value: null },
-        resolution: { value: new Vector2(512, 512) },
-        strokeWidth: { value: 1.0 },
-        strokeColor: { value: new Color("#B2F2FF") },
-        opacity: { value: 1.0 }, // 透明度
-    },
-    vertexShader: `
-            varying vec2 vUv;
-            void main() {
-                vUv = uv;
-                gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
-            }
-        `,
-    fragmentShader: `
-            uniform sampler2D map;
-            uniform vec2 resolution;
-            uniform vec3 strokeColor; // 描边颜色
-            uniform float strokeWidth; // 描边厚度
-            uniform float opacity; // 透明度
-            
-            varying vec2 vUv;
-
-            // 获取当前叠加vu坐标偏移量的颜色值
-            vec4 offsetColor(vec2 vu){
-                return texture2D(map, vUv + (vu * (strokeWidth / resolution) ) );
-            }
-
-            vec4 fragColor(){
-
-                vec4 currentColor = offsetColor(vec2(0.0, 0.0));
-
-                if(
-                    currentColor.a < min(0.2, opacity) && (
-                        offsetColor(vec2(0.0, 1.0)).a > 0.0 ||
-                        offsetColor(vec2(0.0, -1.0)).a > 0.0 ||
-                        offsetColor(vec2(1.0, 0.0)).a > 0.0 ||
-                        offsetColor(vec2(-1.0, 0.0)).a > 0.0 ||
-
-                        offsetColor(vec2(1.0) * 0.7).a > 0.0 ||
-                        offsetColor(vec2(-1.0) * 0.7).a > 0.0 ||
-                        offsetColor(vec2(-1.0, 1.0) * 0.7).a > 0.0 ||
-                        offsetColor(vec2(1.0, -1.0) * 0.7).a > 0.0
-                    )
-                ){
-                    return vec4( strokeColor, opacity);
-                }else{
-                    // discard;
-                    return offsetColor(vec2(0.0, 0.0));
-                }
-
-            }
-
-            void main() {
-                gl_FragColor = fragColor();
-            }
-        `,
-    blending: NoBlending,
-    depthTest: true,
-    depthWrite: true,
-    transparent: true,
-});
-// 高斯模糊着色器 让颜色过渡更自然
-export const gaussBlurShader = new ShaderMaterial({
-    uniforms: {
-        map: { value: null },
-        opacity: { value: 1.0 },
-        radius: { value: 3.0 },
-        resolution: { value: new Vector2(512, 512) }, // 渲染器的分辨率
-    },
-    vertexShader: `
-		varying vec2 vUv;
-		void main() {
-			vUv = uv;
-			gl_Position = vec4(position, 1.0);
-		}
-	`,
-    fragmentShader: `
-		uniform sampler2D map;
-		uniform float opacity;
-		uniform vec2 resolution;
-		uniform float radius;
-		varying vec2 vUv;
-
-        vec4 offsetColor( vec2 uv){
-            return texture2D(map, vUv + (uv / resolution * radius) );
-        }
-
-        vec4 blurColor(){
-
-            vec4 leftColor = offsetColor( vec2(-1.0, 0.0) );
-
-            vec4 rightColor = offsetColor( vec2(1.0, 0.0) );
-
-            // 左右颜色混合
-            vec4 leftRightColor = vec4( 
-                mix( leftColor.rgb ,rightColor.rgb, rightColor.a / (leftColor.a + rightColor.a)),
-                (leftColor.a + rightColor.a) / 2.0
-            );
-
-            vec4 downColor =  offsetColor( vec2(0.0, -1.0));
-
-            vec4 upColor =  offsetColor( vec2(0.0, 1.0));
-
-            // 上下颜色混合
-            vec4 upDownColor = vec4(
-                mix( downColor.rgb, upColor.rgb, upColor.a / (downColor.a + upColor.a) ),
-                (downColor.a + upColor.a) / 2.0
-            );
-           
-            vec4 color = vec4(
-                mix( leftRightColor.rgb, upDownColor.rgb, upDownColor.a / (leftRightColor.a + upDownColor.a) ),
-                (leftRightColor.a + upDownColor.a) / 2.0
-            );
-                
-            return color;
-        }
-
-		void main() {
-			gl_FragColor = blurColor();
-            gl_FragColor.a *= opacity;
-		}
-	`,
-    blending: NoBlending,
-    depthTest: false,
-    depthWrite: false,
-    transparent: true,
-});