| - Extendable asset import, export and management pipeline with built-in support for gltf, glb, obj+mtl, fbx, materials(pmat/bmat), json, zip, png, jpeg, svg, webp, ktx2, ply, 3dm and many more. | - Extendable asset import, export and management pipeline with built-in support for gltf, glb, obj+mtl, fbx, materials(pmat/bmat), json, zip, png, jpeg, svg, webp, ktx2, ply, 3dm and many more. | ||||
| - Automatic serialization of all viewer and plugin settings in GLB(with custom extensions) and JSON formats. | - Automatic serialization of all viewer and plugin settings in GLB(with custom extensions) and JSON formats. | ||||
| - Automatic disposal of all three.js resources with built-in reference management. | - Automatic disposal of all three.js resources with built-in reference management. | ||||
| - Realtime Realistic Rendering with screen-space post-processing effects from [webgi](https://webgi.dev/). | |||||
| ## Examples | ## Examples | ||||
| - [Other classes and interfaces](https://threepipe.org/guide/viewer-api.html#other-classes-and-interfaces) | - [Other classes and interfaces](https://threepipe.org/guide/viewer-api.html#other-classes-and-interfaces) | ||||
| - [Plugins](https://threepipe.org/guide/core-plugins.html#threepipe-plugins) | - [Plugins](https://threepipe.org/guide/core-plugins.html#threepipe-plugins) | ||||
| - [TonemapPlugin](https://threepipe.org/plugin/TonemapPlugin.html) - Add tonemap to the final screen pass | - [TonemapPlugin](https://threepipe.org/plugin/TonemapPlugin.html) - Add tonemap to the final screen pass | ||||
| - [DropzonePlugin](https://threepipe.org/plugin/DropzonePlugin.html - Drag and drop local files to import and load | |||||
| - [DropzonePlugin](https://threepipe.org/plugin/DropzonePlugin.html) - Drag and drop local files to import and load | |||||
| - [ProgressivePlugin](https://threepipe.org/plugin/ProgressivePlugin.html) - Post-render pass to blend the last frame with the current frame | - [ProgressivePlugin](https://threepipe.org/plugin/ProgressivePlugin.html) - Post-render pass to blend the last frame with the current frame | ||||
| - [SSAAPlugin](https://threepipe.org/plugin/SSAAPlugin.html) - Add Super Sample Anti-Aliasing by applying jitter to the camera. | - [SSAAPlugin](https://threepipe.org/plugin/SSAAPlugin.html) - Add Super Sample Anti-Aliasing by applying jitter to the camera. | ||||
| - [DepthBufferPlugin](https://threepipe.org/plugin/DepthBufferPlugin.html) - Pre-rendering of depth buffer | - [DepthBufferPlugin](https://threepipe.org/plugin/DepthBufferPlugin.html) - Pre-rendering of depth buffer | ||||
| - [@threepipe/plugin-gaussian-splatting](https://threepipe.org/package/plugin-gaussian-splatting.html) - Gaussian Splatting plugin for loading and rendering splat files | - [@threepipe/plugin-gaussian-splatting](https://threepipe.org/package/plugin-gaussian-splatting.html) - Gaussian Splatting plugin for loading and rendering splat files | ||||
| - [@threepipe/plugin-network](https://threepipe.org/package/plugin-network.html) - Network/Cloud related plugin implementations for Threepipe. | - [@threepipe/plugin-network](https://threepipe.org/package/plugin-network.html) - Network/Cloud related plugin implementations for Threepipe. | ||||
| - [@threepipe/plugin-svg-renderer](https://threepipe.org/package/plugin-svg-renderer.html) - Add support for exporting 3d scene as SVG. | - [@threepipe/plugin-svg-renderer](https://threepipe.org/package/plugin-svg-renderer.html) - Add support for exporting 3d scene as SVG. | ||||
| - [@threepipe/webgi-plugins](https://webgi.dev) - Realistic rendering plugin pack for threepipe (SSR, SSRTAO, HDR Bloom, TAA, Depth of Field, SSGI, etc.) | |||||
| ## Documentation | ## Documentation | ||||
| "rimraf": "^5.0.1", | "rimraf": "^5.0.1", | ||||
| "rollup-plugin-glsl": "^1.3.0", | "rollup-plugin-glsl": "^1.3.0", | ||||
| "rollup-plugin-license": "^3.0.1", | "rollup-plugin-license": "^3.0.1", | ||||
| "three": "https://github.com/repalash/three.js-modded/releases/download/v0.153.1006/package.tgz", | |||||
| "three": "https://github.com/repalash/three.js-modded/releases/download/v0.155.1001/package.tgz", | |||||
| "tslib": "^2.5.0", | "tslib": "^2.5.0", | ||||
| "typedoc": "^0.27.5", | "typedoc": "^0.27.5", | ||||
| "typescript": "5.7.2", | "typescript": "5.7.2", | ||||
| "dependencies": { | "dependencies": { | ||||
| "uiconfig.js": "^0.1.3", | "uiconfig.js": "^0.1.3", | ||||
| "ts-browser-helpers": "^0.16.2", | "ts-browser-helpers": "^0.16.2", | ||||
| "three": "https://github.com/repalash/three.js-modded/releases/download/v0.153.1006/package.tgz", | |||||
| "three-f": "https://github.com/repalash/three.js-modded/archive/refs/tags/v0.153.1006.tar.gz", | |||||
| "three": "https://github.com/repalash/three.js-modded/releases/download/v0.155.1007/package.tgz", | |||||
| "three-f": "https://github.com/repalash/three.js-modded/archive/refs/tags/v0.155.1007.tar.gz", | |||||
| "@types/three": "https://github.com/repalash/three-ts-types/releases/download/v0.153.1002/package.tgz", | "@types/three": "https://github.com/repalash/three-ts-types/releases/download/v0.153.1002/package.tgz", | ||||
| "@types/three-f": "https://github.com/repalash/three-ts-types/archive/refs/tags/v0.153.1002.tar.gz", | "@types/three-f": "https://github.com/repalash/three-ts-types/archive/refs/tags/v0.153.1002.tar.gz", | ||||
| "@types/three-pkg": "https://gitpkg.now.sh/repalash/three-ts-types/types/three?modded_three" | "@types/three-pkg": "https://gitpkg.now.sh/repalash/three-ts-types/types/three?modded_three" |
| // eslint-disable-next-line no-constant-condition | // eslint-disable-next-line no-constant-condition | ||||
| if (0) | if (0) | ||||
| shader.fragmentShader = shaderReplaceString(shader.fragmentShader, | shader.fragmentShader = shaderReplaceString(shader.fragmentShader, | ||||
| '#include <output_fragment>', | |||||
| '#include <opaque_fragment>', | |||||
| '\ngl_FragColor=diffuseColor;', | '\ngl_FragColor=diffuseColor;', | ||||
| // '\ngl_FragColor=vec4(reflectedLight.directDiffuse, 1.);', | // '\ngl_FragColor=vec4(reflectedLight.directDiffuse, 1.);', | ||||
| // '\ngl_FragColor=vec4(geometryNormal, 1.);', | // '\ngl_FragColor=vec4(geometryNormal, 1.);', |
| for (const fElement of f) shader.fragmentShader = shaderReplaceString(shader.fragmentShader, fElement[0], '#glMarker ' + fElement[1] + '\n' + fElement[0]) | for (const fElement of f) shader.fragmentShader = shaderReplaceString(shader.fragmentShader, fElement[0], '#glMarker ' + fElement[1] + '\n' + fElement[0]) | ||||
| // for NaN. todo do the same in Unlit and line materials? | // for NaN. todo do the same in Unlit and line materials? | ||||
| shader.fragmentShader = shaderReplaceString(shader.fragmentShader, '#include <output_fragment>', 'gl_FragColor = clamp(gl_FragColor, 0.0, 1000.0);\n', {append: true}) | |||||
| shader.fragmentShader = shaderReplaceString(shader.fragmentShader, '#include <opaque_fragment>', 'gl_FragColor = clamp(gl_FragColor, 0.0, 1000.0);\n', {append: true}) | |||||
| iMaterialCommons.onBeforeCompile.call(this, shader, renderer) | iMaterialCommons.onBeforeCompile.call(this, shader, renderer) | ||||
| #if FRAG_CLIPPING_DEBUG | #if FRAG_CLIPPING_DEBUG | ||||
| gl_FragColor = vec4(max(fragClippingDist, 0.0), 0.0, 0.0, 1.0); | gl_FragColor = vec4(max(fragClippingDist, 0.0), 0.0, 0.0, 1.0); | ||||
| // gl_FragColor = vec4(vViewPosition.xyz, 1.0); | // gl_FragColor = vec4(vViewPosition.xyz, 1.0); | ||||
| #include <encodings_fragment> | |||||
| #include <colorspace_fragment> | |||||
| return; | return; | ||||
| #endif | #endif | ||||
| void main() { | void main() { | ||||
| vec4 texel = clamp(weight * tDiffuseTexelToLinear ( texture2D( tDiffuse, vUv ) ) + weight2 * tDiffuse2TexelToLinear ( texture2D( tDiffuse2, vUv ) ), vec4(0), vec4(MAX_INTENSITY)); | vec4 texel = clamp(weight * tDiffuseTexelToLinear ( texture2D( tDiffuse, vUv ) ) + weight2 * tDiffuse2TexelToLinear ( texture2D( tDiffuse2, vUv ) ), vec4(0), vec4(MAX_INTENSITY)); | ||||
| gl_FragColor = texel; | gl_FragColor = texel; | ||||
| #include <encodings_fragment> | |||||
| #include <colorspace_fragment> | |||||
| } | } | ||||
| `, | `, | ||||
| uniforms: { | uniforms: { |
| diffuseColor.a = 1.0; | diffuseColor.a = 1.0; | ||||
| #endif | #endif | ||||
| gl_FragColor = diffuseColor; | gl_FragColor = diffuseColor; | ||||
| ${respectColorSpace ? '#include <encodings_fragment>' : ''} | |||||
| ${respectColorSpace ? '#include <colorspace_fragment>' : ''} | |||||
| } | } | ||||
| `, | `, | ||||
| }, 'tDiffuse') | }, 'tDiffuse') |
| ${blendFunc} | ${blendFunc} | ||||
| c = clamp(c, vec4(0), vec4(MAX_INTENSITY)); | c = clamp(c, vec4(0), vec4(MAX_INTENSITY)); | ||||
| gl_FragColor = c; | gl_FragColor = c; | ||||
| #include <encodings_fragment> | |||||
| #include <colorspace_fragment> | |||||
| } | } | ||||
| `, | `, | ||||
| uniforms: { | uniforms: { |
| gl_FragColor = diffuseColor; | gl_FragColor = diffuseColor; | ||||
| //gl_FragColor = isBackground ? vec4(0, 0, 0, 1) : gl_FragColor; | //gl_FragColor = isBackground ? vec4(0, 0, 0, 1) : gl_FragColor; | ||||
| // gl_FragColor = vec4(depth, 0, 0, 1); | // gl_FragColor = vec4(depth, 0, 0, 1); | ||||
| #include <encodings_fragment> | |||||
| #include <colorspace_fragment> | |||||
| } | } |
| return this._renderer | return this._renderer | ||||
| } | } | ||||
| /** | |||||
| * @deprecated will be removed in the future | |||||
| */ | |||||
| @serialize() | @serialize() | ||||
| get useLegacyLights(): boolean { | get useLegacyLights(): boolean { | ||||
| return this._renderer.useLegacyLights | return this._renderer.useLegacyLights |
| @uiVector() @serialize() clampMin = new Vector3(-10000, -10000, -10000) // should be -Infinity but this breaks the UI | @uiVector() @serialize() clampMin = new Vector3(-10000, -10000, -10000) // should be -Infinity but this breaks the UI | ||||
| @uiVector() @serialize() clampMax = new Vector3(10000, 10000, 10000) // should be Infinity but this breaks the UI | @uiVector() @serialize() clampMax = new Vector3(10000, 10000, 10000) // should be Infinity but this breaks the UI | ||||
| @uiToggle() @serialize() zoomToCursor = true | |||||
| // @uiToggle() | // @uiToggle() | ||||
| @serialize() screenSpacePanning = true | @serialize() screenSpacePanning = true | ||||
| // @uiInput() | // @uiInput() |