@plastic-software/three 0.182.0 → 0.183.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/build/three.cjs +11520 -10877
- package/build/three.core.js +11732 -11340
- package/build/three.core.min.js +2 -2
- package/build/three.module.js +509 -262
- package/build/three.module.min.js +2 -2
- package/build/three.tsl.js +7 -11
- package/build/three.tsl.min.js +2 -2
- package/build/three.webgpu.js +3072 -2607
- package/build/three.webgpu.min.js +2 -2
- package/build/three.webgpu.nodes.js +3071 -2607
- package/build/three.webgpu.nodes.min.js +2 -2
- package/examples/jsm/Addons.js +0 -3
- package/examples/jsm/animation/CCDIKSolver.js +2 -2
- package/examples/jsm/controls/ArcballControls.js +3 -3
- package/examples/jsm/controls/OrbitControls.js +103 -0
- package/examples/jsm/effects/AnaglyphEffect.js +102 -7
- package/examples/jsm/environments/ColorEnvironment.js +59 -0
- package/examples/jsm/environments/RoomEnvironment.js +1 -0
- package/examples/jsm/exporters/EXRExporter.js +1 -1
- package/examples/jsm/exporters/GLTFExporter.js +131 -4
- package/examples/jsm/exporters/USDZExporter.js +22 -3
- package/examples/jsm/helpers/AnimationPathHelper.js +302 -0
- package/examples/jsm/helpers/ViewHelper.js +67 -8
- package/examples/jsm/inspector/Inspector.js +21 -5
- package/examples/jsm/inspector/tabs/Console.js +39 -5
- package/examples/jsm/inspector/tabs/Parameters.js +16 -0
- package/examples/jsm/inspector/ui/Style.js +25 -1
- package/examples/jsm/libs/meshopt_decoder.module.js +6 -5
- package/examples/jsm/lines/LineMaterial.js +6 -0
- package/examples/jsm/loaders/3MFLoader.js +2 -2
- package/examples/jsm/loaders/AMFLoader.js +2 -2
- package/examples/jsm/loaders/ColladaLoader.js +24 -4026
- package/examples/jsm/loaders/EXRLoader.js +5 -5
- package/examples/jsm/loaders/FBXLoader.js +2 -2
- package/examples/jsm/loaders/GCodeLoader.js +34 -8
- package/examples/jsm/loaders/GLTFLoader.js +122 -171
- package/examples/jsm/loaders/KMZLoader.js +5 -5
- package/examples/jsm/loaders/KTX2Loader.js +5 -5
- package/examples/jsm/loaders/LWOLoader.js +7 -39
- package/examples/jsm/loaders/NRRDLoader.js +2 -2
- package/examples/jsm/loaders/PCDLoader.js +3 -2
- package/examples/jsm/loaders/USDLoader.js +100 -40
- package/examples/jsm/loaders/UltraHDRLoader.js +182 -30
- package/examples/jsm/loaders/VRMLLoader.js +77 -0
- package/examples/jsm/loaders/VTKLoader.js +37 -24
- package/examples/jsm/loaders/collada/ColladaComposer.js +2950 -0
- package/examples/jsm/loaders/collada/ColladaParser.js +1962 -0
- package/examples/jsm/loaders/usd/USDAParser.js +447 -366
- package/examples/jsm/loaders/usd/USDCParser.js +1841 -6
- package/examples/jsm/loaders/usd/USDComposer.js +4041 -0
- package/examples/jsm/materials/LDrawConditionalLineNodeMaterial.js +2 -2
- package/examples/jsm/objects/LensflareMesh.js +1 -1
- package/examples/jsm/objects/Sky.js +76 -4
- package/examples/jsm/objects/SkyMesh.js +114 -7
- package/examples/jsm/objects/Water.js +4 -3
- package/examples/jsm/objects/Water2.js +5 -3
- package/examples/jsm/objects/WaterMesh.js +5 -7
- package/examples/jsm/physics/JoltPhysics.js +7 -5
- package/examples/jsm/physics/RapierPhysics.js +6 -4
- package/examples/jsm/postprocessing/EffectComposer.js +7 -5
- package/examples/jsm/postprocessing/RenderTransitionPass.js +1 -1
- package/examples/jsm/renderers/CSS3DRenderer.js +1 -1
- package/examples/jsm/renderers/SVGRenderer.js +2 -2
- package/examples/jsm/shaders/GTAOShader.js +19 -6
- package/examples/jsm/shaders/HalftoneShader.js +12 -1
- package/examples/jsm/shaders/PoissonDenoiseShader.js +6 -2
- package/examples/jsm/shaders/SAOShader.js +17 -4
- package/examples/jsm/shaders/SSAOShader.js +11 -1
- package/examples/jsm/shaders/SSRShader.js +6 -5
- package/examples/jsm/shaders/VignetteShader.js +1 -1
- package/examples/jsm/tsl/display/AfterImageNode.js +1 -1
- package/examples/jsm/tsl/display/AnaglyphPassNode.js +456 -16
- package/examples/jsm/tsl/display/AnamorphicNode.js +1 -1
- package/examples/jsm/tsl/display/BilateralBlurNode.js +364 -0
- package/examples/jsm/tsl/display/BloomNode.js +5 -5
- package/examples/jsm/tsl/display/CRT.js +150 -0
- package/examples/jsm/tsl/display/DenoiseNode.js +1 -1
- package/examples/jsm/tsl/display/DepthOfFieldNode.js +1 -1
- package/examples/jsm/tsl/display/DotScreenNode.js +1 -1
- package/examples/jsm/tsl/display/FXAANode.js +2 -2
- package/examples/jsm/tsl/display/GTAONode.js +2 -2
- package/examples/jsm/tsl/display/GaussianBlurNode.js +11 -2
- package/examples/jsm/tsl/display/GodraysNode.js +624 -0
- package/examples/jsm/tsl/display/LensflareNode.js +1 -1
- package/examples/jsm/tsl/display/Lut3DNode.js +1 -1
- package/examples/jsm/tsl/display/OutlineNode.js +3 -3
- package/examples/jsm/tsl/display/ParallaxBarrierPassNode.js +2 -2
- package/examples/jsm/tsl/display/PixelationPassNode.js +5 -5
- package/examples/jsm/tsl/display/RGBShiftNode.js +2 -2
- package/examples/jsm/tsl/display/RetroPassNode.js +263 -0
- package/examples/jsm/tsl/display/SMAANode.js +2 -2
- package/examples/jsm/tsl/display/SSAAPassNode.js +2 -2
- package/examples/jsm/tsl/display/SSGINode.js +2 -2
- package/examples/jsm/tsl/display/SSRNode.js +7 -7
- package/examples/jsm/tsl/display/SSSNode.js +2 -2
- package/examples/jsm/tsl/display/Shape.js +29 -0
- package/examples/jsm/tsl/display/SobelOperatorNode.js +2 -2
- package/examples/jsm/tsl/display/StereoPassNode.js +1 -2
- package/examples/jsm/tsl/display/TRAANode.js +9 -12
- package/examples/jsm/tsl/display/TransitionNode.js +1 -1
- package/examples/jsm/tsl/display/depthAwareBlend.js +80 -0
- package/examples/jsm/tsl/math/Bayer.js +40 -1
- package/examples/jsm/utils/LDrawUtils.js +1 -1
- package/package.json +11 -19
- package/src/Three.Core.js +1 -1
- package/src/Three.TSL.js +5 -9
- package/src/Three.WebGPU.Nodes.js +2 -0
- package/src/Three.WebGPU.js +3 -0
- package/src/Three.js +1 -0
- package/src/animation/AnimationAction.js +1 -1
- package/src/animation/AnimationClip.js +1 -1
- package/src/animation/AnimationMixer.js +6 -0
- package/src/animation/KeyframeTrack.js +46 -7
- package/src/animation/PropertyMixer.js +4 -4
- package/src/audio/Audio.js +1 -1
- package/src/audio/AudioListener.js +5 -3
- package/src/cameras/Camera.js +32 -2
- package/src/cameras/CubeCamera.js +20 -0
- package/src/constants.js +30 -1
- package/src/core/Clock.js +7 -0
- package/src/core/Object3D.js +56 -4
- package/src/core/RenderTarget.js +3 -4
- package/src/extras/PMREMGenerator.js +4 -8
- package/src/geometries/TorusGeometry.js +8 -3
- package/src/helpers/CameraHelper.js +3 -0
- package/src/helpers/DirectionalLightHelper.js +4 -1
- package/src/helpers/HemisphereLightHelper.js +3 -0
- package/src/helpers/PointLightHelper.js +0 -24
- package/src/helpers/SpotLightHelper.js +3 -0
- package/src/lights/LightShadow.js +15 -3
- package/src/lights/webgpu/IESSpotLight.js +2 -1
- package/src/loaders/Cache.js +28 -0
- package/src/loaders/FileLoader.js +1 -1
- package/src/loaders/ImageBitmapLoader.js +8 -3
- package/src/loaders/Loader.js +6 -0
- package/src/loaders/ObjectLoader.js +18 -1
- package/src/materials/MeshLambertMaterial.js +9 -0
- package/src/materials/MeshPhongMaterial.js +9 -0
- package/src/materials/nodes/Line2NodeMaterial.js +5 -5
- package/src/materials/nodes/MeshPhysicalNodeMaterial.js +2 -0
- package/src/materials/nodes/NodeMaterial.js +15 -24
- package/src/materials/nodes/manager/NodeMaterialObserver.js +9 -3
- package/src/math/Line3.js +3 -5
- package/src/math/MathUtils.js +10 -10
- package/src/math/Matrix4.js +35 -26
- package/src/math/Quaternion.js +3 -29
- package/src/math/Vector3.js +3 -3
- package/src/math/interpolants/BezierInterpolant.js +108 -0
- package/src/nodes/Nodes.js +87 -68
- package/src/nodes/TSL.js +2 -5
- package/src/nodes/accessors/Arrays.js +1 -1
- package/src/nodes/accessors/Bitangent.js +5 -5
- package/src/nodes/accessors/BufferAttributeNode.js +1 -1
- package/src/nodes/accessors/Camera.js +149 -28
- package/src/nodes/accessors/InstanceNode.js +105 -40
- package/src/nodes/accessors/Normal.js +9 -9
- package/src/nodes/accessors/Position.js +34 -2
- package/src/nodes/accessors/SceneProperties.js +53 -0
- package/src/nodes/accessors/SkinningNode.js +12 -24
- package/src/nodes/accessors/StorageBufferNode.js +0 -19
- package/src/nodes/accessors/StorageTextureNode.js +37 -1
- package/src/nodes/accessors/Tangent.js +3 -3
- package/src/nodes/accessors/Texture3DNode.js +6 -34
- package/src/nodes/accessors/TextureNode.js +58 -22
- package/src/nodes/accessors/UniformArrayNode.js +2 -0
- package/src/nodes/core/MRTNode.js +48 -2
- package/src/nodes/core/Node.js +29 -3
- package/src/nodes/core/NodeBuilder.js +115 -40
- package/src/nodes/core/NodeError.js +28 -0
- package/src/nodes/core/NodeUtils.js +5 -3
- package/src/nodes/core/OutputStructNode.js +12 -10
- package/src/nodes/core/ParameterNode.js +2 -1
- package/src/nodes/core/StackNode.js +9 -8
- package/src/nodes/core/StackTrace.js +139 -0
- package/src/nodes/core/StructNode.js +15 -0
- package/src/nodes/core/SubBuildNode.js +1 -1
- package/src/nodes/core/UniformNode.js +2 -1
- package/src/nodes/core/VarNode.js +1 -1
- package/src/nodes/core/VaryingNode.js +1 -18
- package/src/nodes/display/BlendModes.js +0 -64
- package/src/nodes/display/ColorAdjustment.js +17 -0
- package/src/nodes/display/ColorSpaceNode.js +3 -3
- package/src/nodes/display/NormalMapNode.js +2 -2
- package/src/nodes/display/PassNode.js +21 -2
- package/src/nodes/display/RenderOutputNode.js +3 -3
- package/src/nodes/display/ScreenNode.js +2 -1
- package/src/nodes/display/ToneMappingNode.js +1 -1
- package/src/nodes/display/ToonOutlinePassNode.js +2 -2
- package/src/nodes/display/ViewportDepthNode.js +52 -4
- package/src/nodes/display/ViewportTextureNode.js +21 -4
- package/src/nodes/fog/Fog.js +18 -35
- package/src/nodes/functions/PhysicalLightingModel.js +25 -3
- package/src/nodes/geometry/RangeNode.js +4 -2
- package/src/nodes/gpgpu/ComputeNode.js +5 -4
- package/src/nodes/gpgpu/WorkgroupInfoNode.js +2 -1
- package/src/nodes/lighting/EnvironmentNode.js +28 -3
- package/src/nodes/lighting/PointShadowNode.js +24 -12
- package/src/nodes/lighting/ShadowFilterNode.js +15 -43
- package/src/nodes/lighting/ShadowNode.js +54 -32
- package/src/nodes/math/ConditionalNode.js +2 -2
- package/src/nodes/math/MathNode.js +3 -40
- package/src/nodes/math/OperatorNode.js +2 -1
- package/src/nodes/pmrem/PMREMUtils.js +9 -15
- package/src/nodes/tsl/TSLCore.js +13 -10
- package/src/nodes/utils/DebugNode.js +11 -11
- package/src/nodes/utils/JoinNode.js +2 -2
- package/src/nodes/utils/LoopNode.js +1 -1
- package/src/nodes/utils/MemberNode.js +1 -1
- package/src/nodes/utils/RTTNode.js +1 -1
- package/src/nodes/utils/ReflectorNode.js +2 -3
- package/src/nodes/utils/SpriteSheetUV.js +35 -0
- package/src/nodes/utils/UVUtils.js +4 -2
- package/src/objects/BatchedMesh.js +22 -12
- package/src/objects/InstancedMesh.js +11 -0
- package/src/renderers/WebGLRenderer.js +34 -60
- package/src/renderers/common/Backend.js +21 -0
- package/src/renderers/common/Background.js +7 -4
- package/src/renderers/common/BindGroup.js +1 -9
- package/src/renderers/common/Bindings.js +20 -5
- package/src/renderers/common/BlendMode.js +143 -0
- package/src/renderers/common/BundleGroup.js +1 -1
- package/src/renderers/common/CubeRenderTarget.js +50 -6
- package/src/renderers/common/Geometries.js +17 -3
- package/src/renderers/common/Lighting.js +5 -21
- package/src/renderers/common/Pipelines.js +4 -4
- package/src/renderers/common/PostProcessing.js +8 -206
- package/src/renderers/common/RenderBundles.js +2 -1
- package/src/renderers/common/RenderContext.js +16 -0
- package/src/renderers/common/RenderContexts.js +33 -56
- package/src/renderers/common/RenderLists.js +2 -1
- package/src/renderers/common/RenderObject.js +2 -3
- package/src/renderers/common/RenderObjectPipeline.js +40 -0
- package/src/renderers/common/RenderObjects.js +18 -2
- package/src/renderers/common/RenderPipeline.js +203 -17
- package/src/renderers/common/Renderer.js +207 -40
- package/src/renderers/common/Sampler.js +4 -4
- package/src/renderers/common/StorageBuffer.js +13 -1
- package/src/renderers/common/Textures.js +16 -0
- package/src/renderers/common/TimestampQueryPool.js +5 -3
- package/src/renderers/common/Uniform.js +8 -0
- package/src/renderers/common/UniformsGroup.js +60 -0
- package/src/renderers/common/XRManager.js +2 -2
- package/src/renderers/common/nodes/NodeBuilderState.js +1 -1
- package/src/renderers/common/nodes/{Nodes.js → NodeManager.js} +18 -6
- package/src/renderers/common/nodes/NodeStorageBuffer.js +13 -2
- package/src/renderers/shaders/ShaderChunk/batching_pars_vertex.glsl.js +2 -2
- package/src/renderers/shaders/ShaderChunk/color_fragment.glsl.js +1 -5
- package/src/renderers/shaders/ShaderChunk/color_pars_fragment.glsl.js +1 -5
- package/src/renderers/shaders/ShaderChunk/color_pars_vertex.glsl.js +1 -5
- package/src/renderers/shaders/ShaderChunk/color_vertex.glsl.js +8 -10
- package/src/renderers/shaders/ShaderChunk/envmap_fragment.glsl.js +7 -11
- package/src/renderers/shaders/ShaderChunk/lights_fragment_end.glsl.js +6 -0
- package/src/renderers/shaders/ShaderChunk/lights_fragment_maps.glsl.js +6 -2
- package/src/renderers/shaders/ShaderChunk/lights_physical_pars_fragment.glsl.js +23 -1
- package/src/renderers/shaders/ShaderChunk/packing.glsl.js +20 -4
- package/src/renderers/shaders/ShaderChunk/shadowmap_pars_fragment.glsl.js +55 -24
- package/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +2 -0
- package/src/renderers/shaders/ShaderLib/meshphong.glsl.js +2 -0
- package/src/renderers/shaders/ShaderLib/shadow.glsl.js +1 -0
- package/src/renderers/shaders/ShaderLib.js +4 -2
- package/src/renderers/shaders/UniformsLib.js +0 -3
- package/src/renderers/webgl/WebGLBackground.js +2 -2
- package/src/renderers/webgl/WebGLBindingStates.js +99 -27
- package/src/renderers/webgl/WebGLEnvironments.js +228 -0
- package/src/renderers/webgl/WebGLGeometries.js +10 -7
- package/src/renderers/webgl/WebGLMaterials.js +12 -0
- package/src/renderers/webgl/WebGLObjects.js +3 -1
- package/src/renderers/webgl/WebGLProgram.js +2 -2
- package/src/renderers/webgl/WebGLPrograms.js +10 -4
- package/src/renderers/webgl/WebGLRenderLists.js +15 -0
- package/src/renderers/webgl/WebGLShadowMap.js +5 -4
- package/src/renderers/webgl/WebGLState.js +12 -17
- package/src/renderers/webgl-fallback/WebGLBackend.js +71 -7
- package/src/renderers/webgl-fallback/nodes/GLSLNodeBuilder.js +98 -29
- package/src/renderers/webgl-fallback/utils/WebGLState.js +168 -7
- package/src/renderers/webgpu/WebGPUBackend.js +58 -9
- package/src/renderers/webgpu/WebGPURenderer.js +1 -0
- package/src/renderers/webgpu/nodes/WGSLNodeBuilder.js +257 -45
- package/src/renderers/webgpu/utils/WebGPUBindingUtils.js +8 -19
- package/src/renderers/webgpu/utils/WebGPUConstants.js +1 -1
- package/src/renderers/webgpu/utils/WebGPUPipelineUtils.js +56 -31
- package/src/renderers/webgpu/utils/WebGPUTexturePassUtils.js +152 -200
- package/src/renderers/webgpu/utils/WebGPUTextureUtils.js +25 -25
- package/src/renderers/webgpu/utils/WebGPUUtils.js +10 -6
- package/src/renderers/webxr/WebXRManager.js +2 -2
- package/src/textures/Texture.js +2 -2
- package/src/utils.js +246 -3
- package/examples/jsm/materials/MeshGouraudMaterial.js +0 -433
- package/examples/jsm/materials/MeshPostProcessingMaterial.js +0 -167
- package/examples/jsm/shaders/GodRaysShader.js +0 -333
- package/src/nodes/accessors/SceneNode.js +0 -145
- package/src/nodes/code/ScriptableNode.js +0 -726
- package/src/nodes/code/ScriptableValueNode.js +0 -253
- package/src/nodes/display/PosterizeNode.js +0 -65
- package/src/nodes/utils/SpriteSheetUVNode.js +0 -90
- package/src/renderers/webgl/WebGLCubeMaps.js +0 -99
- package/src/renderers/webgl/WebGLCubeUVMaps.js +0 -134
|
@@ -0,0 +1,364 @@
|
|
|
1
|
+
import { RenderTarget, Vector2, NodeMaterial, RendererUtils, QuadMesh, TempNode, NodeUpdateType } from 'three/webgpu';
|
|
2
|
+
import { Fn, float, uv, uniform, convertToTexture, vec2, vec4, passTexture, luminance, abs, exp, max } from 'three/tsl';
|
|
3
|
+
|
|
4
|
+
const _quadMesh = /*@__PURE__*/ new QuadMesh();
|
|
5
|
+
|
|
6
|
+
let _rendererState;
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Post processing node for creating a bilateral blur effect.
|
|
10
|
+
*
|
|
11
|
+
* Bilateral blur smooths an image while preserving sharp edges. Unlike a
|
|
12
|
+
* standard Gaussian blur which blurs everything equally, bilateral blur
|
|
13
|
+
* analyzes the intensity/color of neighboring pixels. If a neighbor is too
|
|
14
|
+
* different from the center pixel (indicating an edge), it is excluded
|
|
15
|
+
* from the blurring process.
|
|
16
|
+
*
|
|
17
|
+
* Reference: {@link https://en.wikipedia.org/wiki/Bilateral_filter}
|
|
18
|
+
*
|
|
19
|
+
* @augments TempNode
|
|
20
|
+
* @three_import import { bilateralBlur } from 'three/addons/tsl/display/BilateralBlurNode.js';
|
|
21
|
+
*/
|
|
22
|
+
class BilateralBlurNode extends TempNode {
|
|
23
|
+
|
|
24
|
+
static get type() {
|
|
25
|
+
|
|
26
|
+
return 'BilateralBlurNode';
|
|
27
|
+
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Constructs a new bilateral blur node.
|
|
32
|
+
*
|
|
33
|
+
* @param {TextureNode} textureNode - The texture node that represents the input of the effect.
|
|
34
|
+
* @param {Node<vec2|float>} directionNode - Defines the direction and radius of the blur.
|
|
35
|
+
* @param {number} sigma - Controls the spatial kernel of the blur filter. Higher values mean a wider blur radius.
|
|
36
|
+
* @param {number} sigmaColor - Controls the intensity kernel. Higher values allow more color difference to be blurred together.
|
|
37
|
+
*/
|
|
38
|
+
constructor( textureNode, directionNode = null, sigma = 4, sigmaColor = 0.1 ) {
|
|
39
|
+
|
|
40
|
+
super( 'vec4' );
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* The texture node that represents the input of the effect.
|
|
44
|
+
*
|
|
45
|
+
* @type {TextureNode}
|
|
46
|
+
*/
|
|
47
|
+
this.textureNode = textureNode;
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* Defines the direction and radius of the blur.
|
|
51
|
+
*
|
|
52
|
+
* @type {Node<vec2|float>}
|
|
53
|
+
*/
|
|
54
|
+
this.directionNode = directionNode;
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Controls the spatial kernel of the blur filter. Higher values mean a wider blur radius.
|
|
58
|
+
*
|
|
59
|
+
* @type {number}
|
|
60
|
+
*/
|
|
61
|
+
this.sigma = sigma;
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Controls the color/intensity kernel. Higher values allow more color difference
|
|
65
|
+
* to be blurred together. Lower values preserve edges more strictly.
|
|
66
|
+
*
|
|
67
|
+
* @type {number}
|
|
68
|
+
*/
|
|
69
|
+
this.sigmaColor = sigmaColor;
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* A uniform node holding the inverse resolution value.
|
|
73
|
+
*
|
|
74
|
+
* @private
|
|
75
|
+
* @type {UniformNode<vec2>}
|
|
76
|
+
*/
|
|
77
|
+
this._invSize = uniform( new Vector2() );
|
|
78
|
+
|
|
79
|
+
/**
|
|
80
|
+
* Bilateral blur is applied in two passes (horizontal, vertical).
|
|
81
|
+
* This node controls the direction of each pass.
|
|
82
|
+
*
|
|
83
|
+
* @private
|
|
84
|
+
* @type {UniformNode<vec2>}
|
|
85
|
+
*/
|
|
86
|
+
this._passDirection = uniform( new Vector2() );
|
|
87
|
+
|
|
88
|
+
/**
|
|
89
|
+
* The render target used for the horizontal pass.
|
|
90
|
+
*
|
|
91
|
+
* @private
|
|
92
|
+
* @type {RenderTarget}
|
|
93
|
+
*/
|
|
94
|
+
this._horizontalRT = new RenderTarget( 1, 1, { depthBuffer: false } );
|
|
95
|
+
this._horizontalRT.texture.name = 'BilateralBlurNode.horizontal';
|
|
96
|
+
|
|
97
|
+
/**
|
|
98
|
+
* The render target used for the vertical pass.
|
|
99
|
+
*
|
|
100
|
+
* @private
|
|
101
|
+
* @type {RenderTarget}
|
|
102
|
+
*/
|
|
103
|
+
this._verticalRT = new RenderTarget( 1, 1, { depthBuffer: false } );
|
|
104
|
+
this._verticalRT.texture.name = 'BilateralBlurNode.vertical';
|
|
105
|
+
|
|
106
|
+
/**
|
|
107
|
+
* The result of the effect is represented as a separate texture node.
|
|
108
|
+
*
|
|
109
|
+
* @private
|
|
110
|
+
* @type {PassTextureNode}
|
|
111
|
+
*/
|
|
112
|
+
this._textureNode = passTexture( this, this._verticalRT.texture );
|
|
113
|
+
this._textureNode.uvNode = textureNode.uvNode;
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* The `updateBeforeType` is set to `NodeUpdateType.FRAME` since the node renders
|
|
117
|
+
* its effect once per frame in `updateBefore()`.
|
|
118
|
+
*
|
|
119
|
+
* @type {string}
|
|
120
|
+
* @default 'frame'
|
|
121
|
+
*/
|
|
122
|
+
this.updateBeforeType = NodeUpdateType.FRAME;
|
|
123
|
+
|
|
124
|
+
/**
|
|
125
|
+
* The resolution scale.
|
|
126
|
+
*
|
|
127
|
+
* @type {number}
|
|
128
|
+
* @default 1
|
|
129
|
+
*/
|
|
130
|
+
this.resolutionScale = 1;
|
|
131
|
+
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
/**
|
|
135
|
+
* Sets the size of the effect.
|
|
136
|
+
*
|
|
137
|
+
* @param {number} width - The width of the effect.
|
|
138
|
+
* @param {number} height - The height of the effect.
|
|
139
|
+
*/
|
|
140
|
+
setSize( width, height ) {
|
|
141
|
+
|
|
142
|
+
width = Math.max( Math.round( width * this.resolutionScale ), 1 );
|
|
143
|
+
height = Math.max( Math.round( height * this.resolutionScale ), 1 );
|
|
144
|
+
|
|
145
|
+
this._invSize.value.set( 1 / width, 1 / height );
|
|
146
|
+
this._horizontalRT.setSize( width, height );
|
|
147
|
+
this._verticalRT.setSize( width, height );
|
|
148
|
+
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* This method is used to render the effect once per frame.
|
|
153
|
+
*
|
|
154
|
+
* @param {NodeFrame} frame - The current node frame.
|
|
155
|
+
*/
|
|
156
|
+
updateBefore( frame ) {
|
|
157
|
+
|
|
158
|
+
const { renderer } = frame;
|
|
159
|
+
|
|
160
|
+
_rendererState = RendererUtils.resetRendererState( renderer, _rendererState );
|
|
161
|
+
|
|
162
|
+
//
|
|
163
|
+
|
|
164
|
+
const textureNode = this.textureNode;
|
|
165
|
+
const map = textureNode.value;
|
|
166
|
+
|
|
167
|
+
const currentTexture = textureNode.value;
|
|
168
|
+
|
|
169
|
+
_quadMesh.material = this._material;
|
|
170
|
+
|
|
171
|
+
this.setSize( map.image.width, map.image.height );
|
|
172
|
+
|
|
173
|
+
const textureType = map.type;
|
|
174
|
+
|
|
175
|
+
this._horizontalRT.texture.type = textureType;
|
|
176
|
+
this._verticalRT.texture.type = textureType;
|
|
177
|
+
|
|
178
|
+
// horizontal
|
|
179
|
+
|
|
180
|
+
renderer.setRenderTarget( this._horizontalRT );
|
|
181
|
+
|
|
182
|
+
this._passDirection.value.set( 1, 0 );
|
|
183
|
+
|
|
184
|
+
_quadMesh.name = 'Bilateral Blur [ Horizontal Pass ]';
|
|
185
|
+
_quadMesh.render( renderer );
|
|
186
|
+
|
|
187
|
+
// vertical
|
|
188
|
+
|
|
189
|
+
textureNode.value = this._horizontalRT.texture;
|
|
190
|
+
renderer.setRenderTarget( this._verticalRT );
|
|
191
|
+
|
|
192
|
+
this._passDirection.value.set( 0, 1 );
|
|
193
|
+
|
|
194
|
+
_quadMesh.name = 'Bilateral Blur [ Vertical Pass ]';
|
|
195
|
+
_quadMesh.render( renderer );
|
|
196
|
+
|
|
197
|
+
// restore
|
|
198
|
+
|
|
199
|
+
textureNode.value = currentTexture;
|
|
200
|
+
|
|
201
|
+
RendererUtils.restoreRendererState( renderer, _rendererState );
|
|
202
|
+
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
/**
|
|
206
|
+
* Returns the result of the effect as a texture node.
|
|
207
|
+
*
|
|
208
|
+
* @return {PassTextureNode} A texture node that represents the result of the effect.
|
|
209
|
+
*/
|
|
210
|
+
getTextureNode() {
|
|
211
|
+
|
|
212
|
+
return this._textureNode;
|
|
213
|
+
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
/**
|
|
217
|
+
* This method is used to setup the effect's TSL code.
|
|
218
|
+
*
|
|
219
|
+
* @param {NodeBuilder} builder - The current node builder.
|
|
220
|
+
* @return {PassTextureNode}
|
|
221
|
+
*/
|
|
222
|
+
setup( builder ) {
|
|
223
|
+
|
|
224
|
+
const textureNode = this.textureNode;
|
|
225
|
+
|
|
226
|
+
//
|
|
227
|
+
|
|
228
|
+
const uvNode = uv();
|
|
229
|
+
const directionNode = vec2( this.directionNode || 1 );
|
|
230
|
+
|
|
231
|
+
const sampleTexture = ( uv ) => textureNode.sample( uv );
|
|
232
|
+
|
|
233
|
+
const blur = Fn( () => {
|
|
234
|
+
|
|
235
|
+
const kernelSize = this.sigma * 2 + 3;
|
|
236
|
+
const spatialCoefficients = this._getSpatialCoefficients( kernelSize );
|
|
237
|
+
|
|
238
|
+
const invSize = this._invSize;
|
|
239
|
+
const direction = directionNode.mul( this._passDirection );
|
|
240
|
+
|
|
241
|
+
// Sample center pixel
|
|
242
|
+
const centerColor = sampleTexture( uvNode ).toVar();
|
|
243
|
+
const centerLuminance = luminance( centerColor.rgb ).toVar();
|
|
244
|
+
|
|
245
|
+
// Accumulate weighted samples
|
|
246
|
+
const weightSum = float( spatialCoefficients[ 0 ] ).toVar();
|
|
247
|
+
const colorSum = vec4( centerColor.mul( spatialCoefficients[ 0 ] ) ).toVar();
|
|
248
|
+
|
|
249
|
+
// Precompute color sigma factor: -0.5 / (sigmaColor^2)
|
|
250
|
+
const colorSigmaFactor = float( - 0.5 ).div( float( this.sigmaColor * this.sigmaColor ) ).toConst();
|
|
251
|
+
|
|
252
|
+
for ( let i = 1; i < kernelSize; i ++ ) {
|
|
253
|
+
|
|
254
|
+
const x = float( i );
|
|
255
|
+
const spatialWeight = float( spatialCoefficients[ i ] );
|
|
256
|
+
|
|
257
|
+
const uvOffset = vec2( direction.mul( invSize.mul( x ) ) ).toVar();
|
|
258
|
+
|
|
259
|
+
// Sample in both directions (+/-)
|
|
260
|
+
const sampleUv1 = uvNode.add( uvOffset );
|
|
261
|
+
const sampleUv2 = uvNode.sub( uvOffset );
|
|
262
|
+
|
|
263
|
+
const sample1 = sampleTexture( sampleUv1 );
|
|
264
|
+
const sample2 = sampleTexture( sampleUv2 );
|
|
265
|
+
|
|
266
|
+
// Compute luminance difference for edge detection
|
|
267
|
+
const lum1 = luminance( sample1.rgb );
|
|
268
|
+
const lum2 = luminance( sample2.rgb );
|
|
269
|
+
|
|
270
|
+
const diff1 = abs( lum1.sub( centerLuminance ) );
|
|
271
|
+
const diff2 = abs( lum2.sub( centerLuminance ) );
|
|
272
|
+
|
|
273
|
+
// Compute color-based weights using Gaussian function
|
|
274
|
+
const colorWeight1 = exp( diff1.mul( diff1 ).mul( colorSigmaFactor ) ).toVar();
|
|
275
|
+
const colorWeight2 = exp( diff2.mul( diff2 ).mul( colorSigmaFactor ) ).toVar();
|
|
276
|
+
|
|
277
|
+
// Combined bilateral weight = spatial weight * color weight
|
|
278
|
+
const bilateralWeight1 = spatialWeight.mul( colorWeight1 );
|
|
279
|
+
const bilateralWeight2 = spatialWeight.mul( colorWeight2 );
|
|
280
|
+
|
|
281
|
+
colorSum.addAssign( sample1.mul( bilateralWeight1 ) );
|
|
282
|
+
colorSum.addAssign( sample2.mul( bilateralWeight2 ) );
|
|
283
|
+
|
|
284
|
+
weightSum.addAssign( bilateralWeight1 );
|
|
285
|
+
weightSum.addAssign( bilateralWeight2 );
|
|
286
|
+
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
// Normalize by the total weight
|
|
290
|
+
return colorSum.div( max( weightSum, 0.0001 ) );
|
|
291
|
+
|
|
292
|
+
} );
|
|
293
|
+
|
|
294
|
+
//
|
|
295
|
+
|
|
296
|
+
const material = this._material || ( this._material = new NodeMaterial() );
|
|
297
|
+
material.fragmentNode = blur().context( builder.getSharedContext() );
|
|
298
|
+
material.name = 'Bilateral_blur';
|
|
299
|
+
material.needsUpdate = true;
|
|
300
|
+
|
|
301
|
+
//
|
|
302
|
+
|
|
303
|
+
const properties = builder.getNodeProperties( this );
|
|
304
|
+
properties.textureNode = textureNode;
|
|
305
|
+
|
|
306
|
+
//
|
|
307
|
+
|
|
308
|
+
return this._textureNode;
|
|
309
|
+
|
|
310
|
+
}
|
|
311
|
+
|
|
312
|
+
/**
|
|
313
|
+
* Frees internal resources. This method should be called
|
|
314
|
+
* when the effect is no longer required.
|
|
315
|
+
*/
|
|
316
|
+
dispose() {
|
|
317
|
+
|
|
318
|
+
this._horizontalRT.dispose();
|
|
319
|
+
this._verticalRT.dispose();
|
|
320
|
+
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
/**
|
|
324
|
+
* Computes spatial (Gaussian) coefficients depending on the given kernel radius.
|
|
325
|
+
* These coefficients are used for the spatial component of the bilateral filter.
|
|
326
|
+
*
|
|
327
|
+
* @private
|
|
328
|
+
* @param {number} kernelRadius - The kernel radius.
|
|
329
|
+
* @return {Array<number>}
|
|
330
|
+
*/
|
|
331
|
+
_getSpatialCoefficients( kernelRadius ) {
|
|
332
|
+
|
|
333
|
+
const coefficients = [];
|
|
334
|
+
const sigma = kernelRadius / 3;
|
|
335
|
+
|
|
336
|
+
for ( let i = 0; i < kernelRadius; i ++ ) {
|
|
337
|
+
|
|
338
|
+
coefficients.push( 0.39894 * Math.exp( - 0.5 * i * i / ( sigma * sigma ) ) / sigma );
|
|
339
|
+
|
|
340
|
+
}
|
|
341
|
+
|
|
342
|
+
return coefficients;
|
|
343
|
+
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
}
|
|
347
|
+
|
|
348
|
+
export default BilateralBlurNode;
|
|
349
|
+
|
|
350
|
+
/**
|
|
351
|
+
* TSL function for creating a bilateral blur node for post processing.
|
|
352
|
+
*
|
|
353
|
+
* Bilateral blur smooths an image while preserving sharp edges by considering
|
|
354
|
+
* both spatial distance and color/intensity differences between pixels.
|
|
355
|
+
*
|
|
356
|
+
* @tsl
|
|
357
|
+
* @function
|
|
358
|
+
* @param {Node<vec4>} node - The node that represents the input of the effect.
|
|
359
|
+
* @param {Node<vec2|float>} directionNode - Defines the direction and radius of the blur.
|
|
360
|
+
* @param {number} sigma - Controls the spatial kernel of the blur filter. Higher values mean a wider blur radius.
|
|
361
|
+
* @param {number} sigmaColor - Controls the intensity kernel. Higher values allow more color difference to be blurred together.
|
|
362
|
+
* @returns {BilateralBlurNode}
|
|
363
|
+
*/
|
|
364
|
+
export const bilateralBlur = ( node, directionNode, sigma, sigmaColor ) => new BilateralBlurNode( convertToTexture( node ), directionNode, sigma, sigmaColor );
|
|
@@ -12,20 +12,20 @@ let _rendererState;
|
|
|
12
12
|
/**
|
|
13
13
|
* Post processing node for creating a bloom effect.
|
|
14
14
|
* ```js
|
|
15
|
-
* const
|
|
15
|
+
* const renderPipeline = new THREE.RenderPipeline( renderer );
|
|
16
16
|
*
|
|
17
17
|
* const scenePass = pass( scene, camera );
|
|
18
18
|
* const scenePassColor = scenePass.getTextureNode( 'output' );
|
|
19
19
|
*
|
|
20
20
|
* const bloomPass = bloom( scenePassColor );
|
|
21
21
|
*
|
|
22
|
-
*
|
|
22
|
+
* renderPipeline.outputNode = scenePassColor.add( bloomPass );
|
|
23
23
|
* ```
|
|
24
24
|
* By default, the node affects the entire image. For a selective bloom,
|
|
25
25
|
* use the `emissive` material property to control which objects should
|
|
26
26
|
* contribute to bloom or not. This can be achieved via MRT.
|
|
27
27
|
* ```js
|
|
28
|
-
* const
|
|
28
|
+
* const renderPipeline = new THREE.RenderPipeline( renderer );
|
|
29
29
|
*
|
|
30
30
|
* const scenePass = pass( scene, camera );
|
|
31
31
|
* scenePass.setMRT( mrt( {
|
|
@@ -37,7 +37,7 @@ let _rendererState;
|
|
|
37
37
|
* const emissivePass = scenePass.getTextureNode( 'emissive' );
|
|
38
38
|
*
|
|
39
39
|
* const bloomPass = bloom( emissivePass );
|
|
40
|
-
*
|
|
40
|
+
* renderPipeline.outputNode = scenePassColor.add( bloomPass );
|
|
41
41
|
* ```
|
|
42
42
|
* @augments TempNode
|
|
43
43
|
* @three_import import { bloom } from 'three/addons/tsl/display/BloomNode.js';
|
|
@@ -529,6 +529,6 @@ class BloomNode extends TempNode {
|
|
|
529
529
|
* @param {number} [threshold=0] - The luminance threshold limits which bright areas contribute to the bloom effect.
|
|
530
530
|
* @returns {BloomNode}
|
|
531
531
|
*/
|
|
532
|
-
export const bloom = ( node, strength, radius, threshold ) =>
|
|
532
|
+
export const bloom = ( node, strength, radius, threshold ) => new BloomNode( nodeObject( node ), strength, radius, threshold );
|
|
533
533
|
|
|
534
534
|
export default BloomNode;
|
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
import { Fn, float, vec2, vec3, sin, screenUV, mix, clamp, dot, convertToTexture, time, uv, select } from 'three/tsl';
|
|
2
|
+
import { circle } from './Shape.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Creates barrel-distorted UV coordinates.
|
|
6
|
+
* The center of the screen appears to bulge outward (convex distortion).
|
|
7
|
+
*
|
|
8
|
+
* @tsl
|
|
9
|
+
* @function
|
|
10
|
+
* @param {Node<float>} [curvature=0.1] - The amount of curvature (0 = flat, 0.5 = very curved).
|
|
11
|
+
* @param {Node<vec2>} [coord=uv()] - The input UV coordinates.
|
|
12
|
+
* @return {Node<vec2>} The distorted UV coordinates.
|
|
13
|
+
*/
|
|
14
|
+
export const barrelUV = Fn( ( [ curvature = float( 0.1 ), coord = uv() ] ) => {
|
|
15
|
+
|
|
16
|
+
// Center UV coordinates (-1 to 1)
|
|
17
|
+
const centered = coord.sub( 0.5 ).mul( 2.0 );
|
|
18
|
+
|
|
19
|
+
// Calculate squared distance from center
|
|
20
|
+
const r2 = dot( centered, centered );
|
|
21
|
+
|
|
22
|
+
// Barrel distortion: push center outward (bulge effect)
|
|
23
|
+
const distortion = float( 1.0 ).sub( r2.mul( curvature ) );
|
|
24
|
+
|
|
25
|
+
// Calculate scale to compensate for edge expansion
|
|
26
|
+
// At corners r² = 2, so we scale by the inverse of corner distortion
|
|
27
|
+
const cornerDistortion = float( 1.0 ).sub( curvature.mul( 2.0 ) );
|
|
28
|
+
|
|
29
|
+
// Apply distortion and compensate scale to keep edges aligned
|
|
30
|
+
const distorted = centered.div( distortion ).mul( cornerDistortion ).mul( 0.5 ).add( 0.5 );
|
|
31
|
+
|
|
32
|
+
return distorted;
|
|
33
|
+
|
|
34
|
+
} );
|
|
35
|
+
|
|
36
|
+
/**
|
|
37
|
+
* Checks if UV coordinates are inside the valid 0-1 range.
|
|
38
|
+
* Useful for masking areas inside the distorted screen.
|
|
39
|
+
*
|
|
40
|
+
* @tsl
|
|
41
|
+
* @function
|
|
42
|
+
* @param {Node<vec2>} coord - The UV coordinates to check.
|
|
43
|
+
* @return {Node<float>} 1.0 if inside bounds, 0.0 if outside.
|
|
44
|
+
*/
|
|
45
|
+
export const barrelMask = Fn( ( [ coord ] ) => {
|
|
46
|
+
|
|
47
|
+
const outOfBounds = coord.x.lessThan( 0.0 )
|
|
48
|
+
.or( coord.x.greaterThan( 1.0 ) )
|
|
49
|
+
.or( coord.y.lessThan( 0.0 ) )
|
|
50
|
+
.or( coord.y.greaterThan( 1.0 ) );
|
|
51
|
+
|
|
52
|
+
return select( outOfBounds, float( 0.0 ), float( 1.0 ) );
|
|
53
|
+
|
|
54
|
+
} );
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Applies color bleeding effect to simulate horizontal color smearing.
|
|
58
|
+
* Simulates the analog signal bleeding in CRT displays where colors
|
|
59
|
+
* "leak" into adjacent pixels horizontally.
|
|
60
|
+
*
|
|
61
|
+
* @tsl
|
|
62
|
+
* @function
|
|
63
|
+
* @param {Node} color - The input texture node.
|
|
64
|
+
* @param {Node<float>} [amount=0.002] - The amount of color bleeding (0-0.01).
|
|
65
|
+
* @return {Node<vec3>} The color with bleeding effect applied.
|
|
66
|
+
*/
|
|
67
|
+
export const colorBleeding = Fn( ( [ color, amount = float( 0.002 ) ] ) => {
|
|
68
|
+
|
|
69
|
+
const inputTexture = convertToTexture( color );
|
|
70
|
+
|
|
71
|
+
// Get the original color
|
|
72
|
+
const original = inputTexture.sample( screenUV ).rgb;
|
|
73
|
+
|
|
74
|
+
// Sample colors from the left (simulating signal trailing)
|
|
75
|
+
const left1 = inputTexture.sample( screenUV.sub( vec2( amount, 0.0 ) ) ).rgb;
|
|
76
|
+
const left2 = inputTexture.sample( screenUV.sub( vec2( amount.mul( 2.0 ), 0.0 ) ) ).rgb;
|
|
77
|
+
const left3 = inputTexture.sample( screenUV.sub( vec2( amount.mul( 3.0 ), 0.0 ) ) ).rgb;
|
|
78
|
+
|
|
79
|
+
// Red bleeds more (travels further in analog signal)
|
|
80
|
+
const bleedR = original.r
|
|
81
|
+
.add( left1.r.mul( 0.4 ) )
|
|
82
|
+
.add( left2.r.mul( 0.2 ) )
|
|
83
|
+
.add( left3.r.mul( 0.1 ) );
|
|
84
|
+
|
|
85
|
+
// Green bleeds medium
|
|
86
|
+
const bleedG = original.g
|
|
87
|
+
.add( left1.g.mul( 0.25 ) )
|
|
88
|
+
.add( left2.g.mul( 0.1 ) );
|
|
89
|
+
|
|
90
|
+
// Blue bleeds least
|
|
91
|
+
const bleedB = original.b
|
|
92
|
+
.add( left1.b.mul( 0.15 ) );
|
|
93
|
+
|
|
94
|
+
// Normalize and clamp
|
|
95
|
+
const r = clamp( bleedR.div( 1.7 ), 0.0, 1.0 );
|
|
96
|
+
const g = clamp( bleedG.div( 1.35 ), 0.0, 1.0 );
|
|
97
|
+
const b = clamp( bleedB.div( 1.15 ), 0.0, 1.0 );
|
|
98
|
+
|
|
99
|
+
return vec3( r, g, b );
|
|
100
|
+
|
|
101
|
+
} );
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* Applies scanline effect to simulate CRT monitor horizontal lines with animation.
|
|
105
|
+
*
|
|
106
|
+
* @tsl
|
|
107
|
+
* @function
|
|
108
|
+
* @param {Node<vec3>} color - The input color.
|
|
109
|
+
* @param {Node<float>} [intensity=0.3] - The intensity of the scanlines (0-1).
|
|
110
|
+
* @param {Node<float>} [count=240] - The number of scanlines (typically matches vertical resolution).
|
|
111
|
+
* @param {Node<float>} [speed=0.0] - The scroll speed of scanlines (0 = static, 1 = normal CRT roll).
|
|
112
|
+
* @param {Node<vec2>} [coord=uv()] - The UV coordinates to use for scanlines.
|
|
113
|
+
* @return {Node<vec3>} The color with scanlines applied.
|
|
114
|
+
*/
|
|
115
|
+
export const scanlines = Fn( ( [ color, intensity = float( 0.3 ), count = float( 240.0 ), speed = float( 0.0 ), coord = uv() ] ) => {
|
|
116
|
+
|
|
117
|
+
// Animate scanlines scrolling down (like CRT vertical sync roll)
|
|
118
|
+
const animatedY = coord.y.sub( time.mul( speed ) );
|
|
119
|
+
|
|
120
|
+
// Create scanline pattern
|
|
121
|
+
const scanline = sin( animatedY.mul( count ) );
|
|
122
|
+
const scanlineIntensity = scanline.mul( 0.5 ).add( 0.5 ).mul( intensity );
|
|
123
|
+
|
|
124
|
+
// Darken alternate lines
|
|
125
|
+
return color.mul( float( 1.0 ).sub( scanlineIntensity ) );
|
|
126
|
+
|
|
127
|
+
} );
|
|
128
|
+
|
|
129
|
+
/**
|
|
130
|
+
* Applies vignette effect to darken the edges of the screen.
|
|
131
|
+
*
|
|
132
|
+
* @tsl
|
|
133
|
+
* @function
|
|
134
|
+
* @param {Node<vec3>} color - The input color.
|
|
135
|
+
* @param {Node<float>} [intensity=0.4] - The intensity of the vignette (0-1).
|
|
136
|
+
* @param {Node<float>} [smoothness=0.5] - The smoothness of the vignette falloff.
|
|
137
|
+
* @param {Node<vec2>} [coord=uv()] - The UV coordinates to use for vignette calculation.
|
|
138
|
+
* @return {Node<vec3>} The color with vignette applied.
|
|
139
|
+
*/
|
|
140
|
+
export const vignette = Fn( ( [ color, intensity = float( 0.4 ), smoothness = float( 0.5 ), coord = uv() ] ) => {
|
|
141
|
+
|
|
142
|
+
// Use circle for radial gradient (1.42 ≈ √2 covers full diagonal)
|
|
143
|
+
const mask = circle( float( 1.42 ), smoothness, coord );
|
|
144
|
+
|
|
145
|
+
// Apply vignette: center = 1, edges = (1 - intensity)
|
|
146
|
+
const vignetteAmount = mix( float( 1.0 ).sub( intensity ), float( 1.0 ), mask );
|
|
147
|
+
|
|
148
|
+
return color.mul( vignetteAmount );
|
|
149
|
+
|
|
150
|
+
} );
|
|
@@ -331,4 +331,4 @@ function generateDefaultNoise( size = 64 ) {
|
|
|
331
331
|
* @param {Camera} camera - The camera the scene is rendered with.
|
|
332
332
|
* @returns {DenoiseNode}
|
|
333
333
|
*/
|
|
334
|
-
export const denoise = ( node, depthNode, normalNode, camera ) =>
|
|
334
|
+
export const denoise = ( node, depthNode, normalNode, camera ) => new DenoiseNode( convertToTexture( node ), nodeObject( depthNode ), nodeObject( normalNode ), camera );
|
|
@@ -551,4 +551,4 @@ export default DepthOfFieldNode;
|
|
|
551
551
|
* @param {Node<float> | number} bokehScale - A unitless value for artistic purposes to adjust the size of the bokeh.
|
|
552
552
|
* @returns {DepthOfFieldNode}
|
|
553
553
|
*/
|
|
554
|
-
export const dof = ( node, viewZNode, focusDistance = 1, focalLength = 1, bokehScale = 1 ) =>
|
|
554
|
+
export const dof = ( node, viewZNode, focusDistance = 1, focalLength = 1, bokehScale = 1 ) => new DepthOfFieldNode( convertToTexture( node ), nodeObject( viewZNode ), nodeObject( focusDistance ), nodeObject( focalLength ), nodeObject( bokehScale ) );
|
|
@@ -101,4 +101,4 @@ export default DotScreenNode;
|
|
|
101
101
|
* @param {number} [scale=1] - The scale of the effect. A higher value means smaller dots.
|
|
102
102
|
* @returns {DotScreenNode}
|
|
103
103
|
*/
|
|
104
|
-
export const dotScreen = ( node, angle, scale ) =>
|
|
104
|
+
export const dotScreen = ( node, angle, scale ) => new DotScreenNode( nodeObject( node ), angle, scale );
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Vector2, TempNode } from 'three/webgpu';
|
|
2
|
-
import {
|
|
2
|
+
import { Fn, uniformArray, select, float, NodeUpdateType, uv, dot, clamp, uniform, convertToTexture, smoothstep, bool, vec2, vec3, If, Loop, max, min, Break, abs } from 'three/tsl';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Post processing node for applying FXAA. This node requires sRGB input
|
|
@@ -362,4 +362,4 @@ export default FXAANode;
|
|
|
362
362
|
* @param {Node<vec4>} node - The node that represents the input of the effect.
|
|
363
363
|
* @returns {FXAANode}
|
|
364
364
|
*/
|
|
365
|
-
export const fxaa = ( node ) =>
|
|
365
|
+
export const fxaa = ( node ) => new FXAANode( convertToTexture( node ) );
|
|
@@ -12,7 +12,7 @@ let _rendererState;
|
|
|
12
12
|
/**
|
|
13
13
|
* Post processing node for applying Ground Truth Ambient Occlusion (GTAO) to a scene.
|
|
14
14
|
* ```js
|
|
15
|
-
* const
|
|
15
|
+
* const renderPipeline = new THREE.RenderPipeline( renderer );
|
|
16
16
|
*
|
|
17
17
|
* const scenePass = pass( scene, camera );
|
|
18
18
|
* scenePass.setMRT( mrt( {
|
|
@@ -26,7 +26,7 @@ let _rendererState;
|
|
|
26
26
|
*
|
|
27
27
|
* const aoPass = ao( scenePassDepth, scenePassNormal, camera );
|
|
28
28
|
*
|
|
29
|
-
*
|
|
29
|
+
* renderPipeline.outputNode = aoPass.getTextureNode().mul( scenePassColor );
|
|
30
30
|
* ```
|
|
31
31
|
*
|
|
32
32
|
* Reference: [Practical Real-Time Strategies for Accurate Indirect Occlusion](https://www.activision.com/cdn/research/Practical_Real_Time_Strategies_for_Accurate_Indirect_Occlusion_NEW%20VERSION_COLOR.pdf).
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { RenderTarget, Vector2, NodeMaterial, RendererUtils, QuadMesh, TempNode, NodeUpdateType } from 'three/webgpu';
|
|
2
|
-
import {
|
|
2
|
+
import { Fn, float, uv, uniform, convertToTexture, vec2, vec4, passTexture, premultiplyAlpha, unpremultiplyAlpha } from 'three/tsl';
|
|
3
3
|
|
|
4
4
|
const _quadMesh = /*@__PURE__*/ new QuadMesh();
|
|
5
5
|
|
|
@@ -124,6 +124,15 @@ class GaussianBlurNode extends TempNode {
|
|
|
124
124
|
*/
|
|
125
125
|
this.premultipliedAlpha = options.premultipliedAlpha || false;
|
|
126
126
|
|
|
127
|
+
/**
|
|
128
|
+
* This flag can be used for type testing.
|
|
129
|
+
*
|
|
130
|
+
* @type {boolean}
|
|
131
|
+
* @default true
|
|
132
|
+
* @readonly
|
|
133
|
+
*/
|
|
134
|
+
this.isGaussianBlurNode = true;
|
|
135
|
+
|
|
127
136
|
}
|
|
128
137
|
|
|
129
138
|
/**
|
|
@@ -358,7 +367,7 @@ export default GaussianBlurNode;
|
|
|
358
367
|
* @param {number} [options.resolutionScale=1] - The resolution of the effect. 0.5 means half the resolution of the texture node.
|
|
359
368
|
* @returns {GaussianBlurNode}
|
|
360
369
|
*/
|
|
361
|
-
export const gaussianBlur = ( node, directionNode, sigma, options = {} ) =>
|
|
370
|
+
export const gaussianBlur = ( node, directionNode, sigma, options = {} ) => new GaussianBlurNode( convertToTexture( node ), directionNode, sigma, options );
|
|
362
371
|
|
|
363
372
|
/**
|
|
364
373
|
* TSL function for creating a gaussian blur node for post processing with enabled premultiplied alpha.
|