@babylonjs/post-processes 7.31.0 → 7.31.1
Sign up to get free protection for your applications and to get access to all the features.
- package/edgeDetection/edgeDetection.fragment.d.ts +5 -0
- package/edgeDetection/edgeDetection.fragment.js +17 -0
- package/edgeDetection/edgeDetection.fragment.js.map +1 -0
- package/edgeDetection/edgeDetectionPostProcess.d.ts +61 -0
- package/edgeDetection/edgeDetectionPostProcess.js +131 -0
- package/edgeDetection/edgeDetectionPostProcess.js.map +1 -0
- package/edgeDetection/index.d.ts +1 -0
- package/edgeDetection/index.js +2 -0
- package/edgeDetection/index.js.map +1 -0
- package/index.d.ts +1 -0
- package/index.js +1 -0
- package/index.js.map +1 -1
- package/package.json +2 -2
@@ -0,0 +1,17 @@
|
|
1
|
+
// Do not edit.
|
2
|
+
import { ShaderStore } from "@babylonjs/core/Engines/shaderStore.js";
|
3
|
+
const name = "edgeDetectionPixelShader";
|
4
|
+
const shader = `precision highp float;varying vec2 vUV;uniform sampler2D textureSampler;uniform sampler2D normalSampler;uniform sampler2D depthSampler;uniform float width;uniform float height;uniform vec3 edgeColor;uniform float edgeIntensity;uniform float edgeWidth;uniform int renderMode;
|
5
|
+
vec3 boxBlur(sampler2D sampler,vec2 uv,vec2 texelSize) {vec3 result=vec3(0.0);for (int x=-1; x<=1; x++) {for (int y=-1; y<=1; y++) {vec2 offset=vec2(float(x),float(y))*texelSize;result+=texture2D(sampler,uv+offset).rgb;}}
|
6
|
+
return result/9.0;}
|
7
|
+
void main(void) {vec2 texelSize=vec2(1.0/width,1.0/height);vec3 originalColor=texture2D(textureSampler,vUV).rgb;if (renderMode==1 || renderMode==2 || renderMode==3) {if (length(originalColor)==0.0) {originalColor=vec3(1.0,1.0,1.0); }
|
8
|
+
if (originalColor.r==1.0 && originalColor.g==0.0 && originalColor.b==0.0) {originalColor=vec3(1.0,1.0,1.0); }}
|
9
|
+
vec3 normal=texture2D(normalSampler,vUV).rgb;float depth=texture2D(depthSampler,vUV).r;float edgeStrength=0.0;int range=int(edgeWidth*8.0);
|
10
|
+
for (int x=-range; x<=range; x++) {for (int y=-range; y<=range; y++) {if (x==0 && y==0) {continue;}
|
11
|
+
vec3 neighborNormal=texture2D(normalSampler,vUV+texelSize*vec2(float(x),float(y))).rgb;float neighborDepth=texture2D(depthSampler,vUV+texelSize*vec2(float(x),float(y))).r;float normalDiff=length(neighborNormal-normal);float depthDiff=abs(neighborDepth-depth);edgeStrength=max(edgeStrength,max(normalDiff,depthDiff));}}
|
12
|
+
edgeStrength=smoothstep(edgeWidth,edgeWidth+edgeIntensity,edgeStrength);vec3 finalColor=mix(originalColor,edgeColor,edgeStrength);gl_FragColor=vec4(finalColor,1.0);}`;
|
13
|
+
// Sideeffect
|
14
|
+
ShaderStore.ShadersStore[name] = shader;
|
15
|
+
/** @internal */
|
16
|
+
export const edgeDetectionPixelShader = { name, shader };
|
17
|
+
//# sourceMappingURL=edgeDetection.fragment.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"edgeDetection.fragment.js","sourceRoot":"","sources":["../../../../dev/postProcesses/src/edgeDetection/edgeDetection.fragment.ts"],"names":[],"mappings":"AAAA,eAAe;AACf,OAAO,EAAE,WAAW,EAAE,+CAAiC;AAEvD,MAAM,IAAI,GAAG,0BAA0B,CAAC;AACxC,MAAM,MAAM,GAAG;;;;;;;;sKAQuJ,CAAC;AACvK,aAAa;AACb,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC;AACxC,gBAAgB;AAChB,MAAM,CAAC,MAAM,wBAAwB,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC","sourcesContent":["// Do not edit.\nimport { ShaderStore } from \"core/Engines/shaderStore\";\n\nconst name = \"edgeDetectionPixelShader\";\nconst shader = `precision highp float;varying vec2 vUV;uniform sampler2D textureSampler;uniform sampler2D normalSampler;uniform sampler2D depthSampler;uniform float width;uniform float height;uniform vec3 edgeColor;uniform float edgeIntensity;uniform float edgeWidth;uniform int renderMode; \nvec3 boxBlur(sampler2D sampler,vec2 uv,vec2 texelSize) {vec3 result=vec3(0.0);for (int x=-1; x<=1; x++) {for (int y=-1; y<=1; y++) {vec2 offset=vec2(float(x),float(y))*texelSize;result+=texture2D(sampler,uv+offset).rgb;}}\nreturn result/9.0;}\nvoid main(void) {vec2 texelSize=vec2(1.0/width,1.0/height);vec3 originalColor=texture2D(textureSampler,vUV).rgb;if (renderMode==1 || renderMode==2 || renderMode==3) {if (length(originalColor)==0.0) {originalColor=vec3(1.0,1.0,1.0); }\nif (originalColor.r==1.0 && originalColor.g==0.0 && originalColor.b==0.0) {originalColor=vec3(1.0,1.0,1.0); }}\nvec3 normal=texture2D(normalSampler,vUV).rgb;float depth=texture2D(depthSampler,vUV).r;float edgeStrength=0.0;int range=int(edgeWidth*8.0); \nfor (int x=-range; x<=range; x++) {for (int y=-range; y<=range; y++) {if (x==0 && y==0) {continue;}\nvec3 neighborNormal=texture2D(normalSampler,vUV+texelSize*vec2(float(x),float(y))).rgb;float neighborDepth=texture2D(depthSampler,vUV+texelSize*vec2(float(x),float(y))).r;float normalDiff=length(neighborNormal-normal);float depthDiff=abs(neighborDepth-depth);edgeStrength=max(edgeStrength,max(normalDiff,depthDiff));}}\nedgeStrength=smoothstep(edgeWidth,edgeWidth+edgeIntensity,edgeStrength);vec3 finalColor=mix(originalColor,edgeColor,edgeStrength);gl_FragColor=vec4(finalColor,1.0);}`;\n// Sideeffect\nShaderStore.ShadersStore[name] = shader;\n/** @internal */\nexport const edgeDetectionPixelShader = { name, shader };\n"]}
|
@@ -0,0 +1,61 @@
|
|
1
|
+
import type { Nullable } from "@babylonjs/core/types.js";
|
2
|
+
import type { Camera } from "@babylonjs/core/Cameras/camera.js";
|
3
|
+
import type { PostProcessOptions } from "@babylonjs/core/PostProcesses/postProcess.js";
|
4
|
+
import { PostProcess } from "@babylonjs/core/PostProcesses/postProcess.js";
|
5
|
+
import "@babylonjs/core/Rendering/geometryBufferRendererSceneComponent.js";
|
6
|
+
import { Color3 } from "@babylonjs/core/Maths/math.color.js";
|
7
|
+
import type { Scene } from "@babylonjs/core/scene.js";
|
8
|
+
import "./edgeDetection.fragment";
|
9
|
+
/**
|
10
|
+
* The Edge Detection effect highlights the edges of objects in the scene like a toon.
|
11
|
+
* This can be used for stylized rendering, outlining, or visual effects that require edge enhancement.
|
12
|
+
*/
|
13
|
+
export declare class EdgeDetectionPostProcess extends PostProcess {
|
14
|
+
/**
|
15
|
+
* Defines the color of the detected edges.
|
16
|
+
*/
|
17
|
+
edgeColor: Color3;
|
18
|
+
/**
|
19
|
+
* Defines the intensity of the detected edges.
|
20
|
+
* Higher values result in more pronounced edges.
|
21
|
+
* default: 0.2 (min:0, max:1)
|
22
|
+
*/
|
23
|
+
edgeIntensity: number;
|
24
|
+
/**
|
25
|
+
* Defines the width of the detected edges.
|
26
|
+
* Higher values result in thicker edges.
|
27
|
+
* default: 0.2 (min:0.125, max:1)
|
28
|
+
*/
|
29
|
+
edgeWidth: number;
|
30
|
+
/**
|
31
|
+
* Defines the render mode.
|
32
|
+
* default: 0
|
33
|
+
* 0: general, 1: normal, 2: depth, 3: outline only
|
34
|
+
*/
|
35
|
+
renderMode: number;
|
36
|
+
private _geometryBufferRenderer;
|
37
|
+
/**
|
38
|
+
* Get the current class name of the current effect
|
39
|
+
* @returns "EdgeDetectionPostProcess"
|
40
|
+
*/
|
41
|
+
getClassName(): string;
|
42
|
+
/**
|
43
|
+
* Creates a new instance of EdgeDetectionPostProcess.
|
44
|
+
* @param name The name of the effect.
|
45
|
+
* @param scene The scene where the edge detection post-process will be applied.
|
46
|
+
* @param options The required width/height ratio or specific options for the post-process.
|
47
|
+
* @param camera The camera to apply the post-process to.
|
48
|
+
* @param samplingMode The sampling mode to be used when computing the pass. (default: TEXTURE_NEAREST_NEAREST)
|
49
|
+
* @param reusable If the post-process can be reused on the same frame. (default: false)
|
50
|
+
* @param textureType The type of textures used when performing the post-process. (default: TEXTURETYPE_HALF_FLOAT)
|
51
|
+
*/
|
52
|
+
constructor(name: string, scene: Scene, options: number | PostProcessOptions, camera: Nullable<Camera>, samplingMode?: number, reusable?: boolean, textureType?: number);
|
53
|
+
/**
|
54
|
+
* Support test.
|
55
|
+
*/
|
56
|
+
static get IsSupported(): boolean;
|
57
|
+
/**
|
58
|
+
* @internal
|
59
|
+
*/
|
60
|
+
static _Parse(parsedPostProcess: any, targetCamera: Camera, scene: Scene, rootUrl: string): EdgeDetectionPostProcess;
|
61
|
+
}
|
@@ -0,0 +1,131 @@
|
|
1
|
+
import { __decorate } from "@babylonjs/core/tslib.es6.js";
|
2
|
+
import { Logger } from "@babylonjs/core/Misc/logger.js";
|
3
|
+
import { PostProcess } from "@babylonjs/core/PostProcesses/postProcess.js";
|
4
|
+
import { Constants } from "@babylonjs/core/Engines/constants.js";
|
5
|
+
import "@babylonjs/core/Rendering/geometryBufferRendererSceneComponent.js";
|
6
|
+
import { Color3 } from "@babylonjs/core/Maths/math.color.js";
|
7
|
+
import { serialize } from "@babylonjs/core/Misc/decorators.js";
|
8
|
+
import { SerializationHelper } from "@babylonjs/core/Misc/decorators.serialization.js";
|
9
|
+
import { RegisterClass } from "@babylonjs/core/Misc/typeStore.js";
|
10
|
+
import { EngineStore } from "@babylonjs/core/Engines/engineStore.js";
|
11
|
+
import { RenderTargetTexture } from "@babylonjs/core/Materials/Textures/renderTargetTexture.js";
|
12
|
+
import "./edgeDetection.fragment.js";
|
13
|
+
/**
|
14
|
+
* The Edge Detection effect highlights the edges of objects in the scene like a toon.
|
15
|
+
* This can be used for stylized rendering, outlining, or visual effects that require edge enhancement.
|
16
|
+
*/
|
17
|
+
export class EdgeDetectionPostProcess extends PostProcess {
|
18
|
+
/**
|
19
|
+
* Get the current class name of the current effect
|
20
|
+
* @returns "EdgeDetectionPostProcess"
|
21
|
+
*/
|
22
|
+
getClassName() {
|
23
|
+
return "EdgeDetectionPostProcess";
|
24
|
+
}
|
25
|
+
/**
|
26
|
+
* Creates a new instance of EdgeDetectionPostProcess.
|
27
|
+
* @param name The name of the effect.
|
28
|
+
* @param scene The scene where the edge detection post-process will be applied.
|
29
|
+
* @param options The required width/height ratio or specific options for the post-process.
|
30
|
+
* @param camera The camera to apply the post-process to.
|
31
|
+
* @param samplingMode The sampling mode to be used when computing the pass. (default: TEXTURE_NEAREST_NEAREST)
|
32
|
+
* @param reusable If the post-process can be reused on the same frame. (default: false)
|
33
|
+
* @param textureType The type of textures used when performing the post-process. (default: TEXTURETYPE_HALF_FLOAT)
|
34
|
+
*/
|
35
|
+
constructor(name, scene, options, camera, samplingMode, reusable, textureType = Constants.TEXTURETYPE_UNSIGNED_INT) {
|
36
|
+
super(name, "edgeDetection", ["width", "height", "edgeColor", "edgeIntensity", "edgeWidth", "renderMode"], ["normalSampler", "depthSampler"], options, camera, samplingMode, scene.getEngine(), reusable, null, textureType);
|
37
|
+
/**
|
38
|
+
* Defines the color of the detected edges.
|
39
|
+
*/
|
40
|
+
this.edgeColor = new Color3(0, 0, 0);
|
41
|
+
/**
|
42
|
+
* Defines the intensity of the detected edges.
|
43
|
+
* Higher values result in more pronounced edges.
|
44
|
+
* default: 0.2 (min:0, max:1)
|
45
|
+
*/
|
46
|
+
this.edgeIntensity = 0.2;
|
47
|
+
/**
|
48
|
+
* Defines the width of the detected edges.
|
49
|
+
* Higher values result in thicker edges.
|
50
|
+
* default: 0.2 (min:0.125, max:1)
|
51
|
+
*/
|
52
|
+
this.edgeWidth = 0.2;
|
53
|
+
/**
|
54
|
+
* Defines the render mode.
|
55
|
+
* default: 0
|
56
|
+
* 0: general, 1: normal, 2: depth, 3: outline only
|
57
|
+
*/
|
58
|
+
this.renderMode = 0;
|
59
|
+
this._geometryBufferRenderer = scene.enableGeometryBufferRenderer();
|
60
|
+
if (!this._geometryBufferRenderer) {
|
61
|
+
// Geometry buffer renderer is not supported. So, work as a passthrough.
|
62
|
+
Logger.Error("Geometry Buffer Renderer support is required for this post-process.");
|
63
|
+
}
|
64
|
+
else {
|
65
|
+
// Geometry buffer renderer is supported.
|
66
|
+
this.onApply = (effect) => {
|
67
|
+
effect.setFloat("width", this.width);
|
68
|
+
effect.setFloat("height", this.height);
|
69
|
+
effect.setFloat("edgeIntensity", this.edgeIntensity);
|
70
|
+
effect.setFloat("edgeWidth", this.edgeWidth);
|
71
|
+
effect.setColor3("edgeColor", this.edgeColor);
|
72
|
+
const normalTexture = this._geometryBufferRenderer.getGBuffer().textures[1];
|
73
|
+
const depthTexture = this._geometryBufferRenderer.getGBuffer().textures[0];
|
74
|
+
effect.setTexture("normalSampler", normalTexture);
|
75
|
+
effect.setTexture("depthSampler", depthTexture);
|
76
|
+
const h1 = new RenderTargetTexture("h1", { width: this.width, height: this.height }, scene, {
|
77
|
+
samplingMode: Constants.TEXTURE_NEAREST_NEAREST,
|
78
|
+
generateMipMaps: false,
|
79
|
+
generateDepthBuffer: false,
|
80
|
+
type: Constants.TEXTURETYPE_HALF_FLOAT,
|
81
|
+
});
|
82
|
+
switch (this.renderMode) {
|
83
|
+
case 0:
|
84
|
+
break;
|
85
|
+
case 1:
|
86
|
+
effect.setTexture("textureSampler", this._geometryBufferRenderer.getGBuffer().textures[1]);
|
87
|
+
effect.setFloat("edgeWidth", 0);
|
88
|
+
break;
|
89
|
+
case 2:
|
90
|
+
effect.setTexture("textureSampler", this._geometryBufferRenderer.getGBuffer().textures[0]);
|
91
|
+
effect.setFloat("edgeWidth", 0);
|
92
|
+
break;
|
93
|
+
case 3:
|
94
|
+
effect.setTexture("textureSampler", h1);
|
95
|
+
break;
|
96
|
+
}
|
97
|
+
effect.setInt("renderMode", this.renderMode);
|
98
|
+
};
|
99
|
+
}
|
100
|
+
}
|
101
|
+
/**
|
102
|
+
* Support test.
|
103
|
+
*/
|
104
|
+
static get IsSupported() {
|
105
|
+
const engine = EngineStore.LastCreatedEngine;
|
106
|
+
if (!engine) {
|
107
|
+
return false;
|
108
|
+
}
|
109
|
+
return engine.getCaps().drawBuffersExtension;
|
110
|
+
}
|
111
|
+
/**
|
112
|
+
* @internal
|
113
|
+
*/
|
114
|
+
static _Parse(parsedPostProcess, targetCamera, scene, rootUrl) {
|
115
|
+
return SerializationHelper.Parse(() => new EdgeDetectionPostProcess(parsedPostProcess.name, scene, parsedPostProcess.options, targetCamera, parsedPostProcess.renderTargetSamplingMode, parsedPostProcess.textureType, parsedPostProcess.reusable), parsedPostProcess, scene, rootUrl);
|
116
|
+
}
|
117
|
+
}
|
118
|
+
__decorate([
|
119
|
+
serialize()
|
120
|
+
], EdgeDetectionPostProcess.prototype, "edgeColor", void 0);
|
121
|
+
__decorate([
|
122
|
+
serialize()
|
123
|
+
], EdgeDetectionPostProcess.prototype, "edgeIntensity", void 0);
|
124
|
+
__decorate([
|
125
|
+
serialize()
|
126
|
+
], EdgeDetectionPostProcess.prototype, "edgeWidth", void 0);
|
127
|
+
__decorate([
|
128
|
+
serialize()
|
129
|
+
], EdgeDetectionPostProcess.prototype, "renderMode", void 0);
|
130
|
+
RegisterClass("BABYLON.EdgeDetectionPostProcess", EdgeDetectionPostProcess);
|
131
|
+
//# sourceMappingURL=edgeDetectionPostProcess.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"edgeDetectionPostProcess.js","sourceRoot":"","sources":["../../../../dev/postProcesses/src/edgeDetection/edgeDetectionPostProcess.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Nullable } from \"core/types\";\r\nimport { Logger } from \"core/Misc/logger\";\r\nimport type { Camera } from \"core/Cameras/camera\";\r\nimport type { Effect } from \"core/Materials/effect\";\r\nimport type { PostProcessOptions } from \"core/PostProcesses/postProcess\";\r\nimport { PostProcess } from \"core/PostProcesses/postProcess\";\r\nimport { Constants } from \"core/Engines/constants\";\r\nimport \"core/Rendering/geometryBufferRendererSceneComponent\";\r\nimport type { GeometryBufferRenderer } from \"core/Rendering/geometryBufferRenderer\";\r\nimport { Color3 } from \"core/Maths/math.color\";\r\nimport { serialize } from \"core/Misc/decorators\";\r\nimport { SerializationHelper } from \"core/Misc/decorators.serialization\";\r\nimport { RegisterClass } from \"core/Misc/typeStore\";\r\nimport { EngineStore } from \"core/Engines/engineStore\";\r\nimport { RenderTargetTexture } from \"core/Materials/Textures/renderTargetTexture\";\r\nimport type { Scene } from \"core/scene\";\r\nimport \"./edgeDetection.fragment\";\r\n\r\n/**\r\n * The Edge Detection effect highlights the edges of objects in the scene like a toon.\r\n * This can be used for stylized rendering, outlining, or visual effects that require edge enhancement.\r\n */\r\nexport class EdgeDetectionPostProcess extends PostProcess {\r\n /**\r\n * Defines the color of the detected edges.\r\n */\r\n @serialize()\r\n public edgeColor: Color3 = new Color3(0, 0, 0);\r\n\r\n /**\r\n * Defines the intensity of the detected edges.\r\n * Higher values result in more pronounced edges.\r\n * default: 0.2 (min:0, max:1)\r\n */\r\n @serialize()\r\n public edgeIntensity: number = 0.2;\r\n\r\n /**\r\n * Defines the width of the detected edges.\r\n * Higher values result in thicker edges.\r\n * default: 0.2 (min:0.125, max:1)\r\n */\r\n @serialize()\r\n public edgeWidth: number = 0.2;\r\n\r\n /**\r\n * Defines the render mode.\r\n * default: 0\r\n * 0: general, 1: normal, 2: depth, 3: outline only\r\n */\r\n @serialize()\r\n public renderMode: number = 0;\r\n\r\n private _geometryBufferRenderer: Nullable<GeometryBufferRenderer>;\r\n\r\n /**\r\n * Get the current class name of the current effect\r\n * @returns \"EdgeDetectionPostProcess\"\r\n */\r\n public override getClassName(): string {\r\n return \"EdgeDetectionPostProcess\";\r\n }\r\n\r\n /**\r\n * Creates a new instance of EdgeDetectionPostProcess.\r\n * @param name The name of the effect.\r\n * @param scene The scene where the edge detection post-process will be applied.\r\n * @param options The required width/height ratio or specific options for the post-process.\r\n * @param camera The camera to apply the post-process to.\r\n * @param samplingMode The sampling mode to be used when computing the pass. (default: TEXTURE_NEAREST_NEAREST)\r\n * @param reusable If the post-process can be reused on the same frame. (default: false)\r\n * @param textureType The type of textures used when performing the post-process. (default: TEXTURETYPE_HALF_FLOAT)\r\n */\r\n constructor(\r\n name: string,\r\n scene: Scene,\r\n options: number | PostProcessOptions,\r\n camera: Nullable<Camera>,\r\n samplingMode?: number,\r\n reusable?: boolean,\r\n textureType: number = Constants.TEXTURETYPE_UNSIGNED_INT\r\n ) {\r\n super(\r\n name,\r\n \"edgeDetection\",\r\n [\"width\", \"height\", \"edgeColor\", \"edgeIntensity\", \"edgeWidth\", \"renderMode\"],\r\n [\"normalSampler\", \"depthSampler\"],\r\n options,\r\n camera,\r\n samplingMode,\r\n scene.getEngine(),\r\n reusable,\r\n null,\r\n textureType\r\n );\r\n\r\n this._geometryBufferRenderer = scene.enableGeometryBufferRenderer();\r\n\r\n if (!this._geometryBufferRenderer) {\r\n // Geometry buffer renderer is not supported. So, work as a passthrough.\r\n Logger.Error(\"Geometry Buffer Renderer support is required for this post-process.\");\r\n } else {\r\n // Geometry buffer renderer is supported.\r\n this.onApply = (effect: Effect) => {\r\n effect.setFloat(\"width\", this.width);\r\n effect.setFloat(\"height\", this.height);\r\n effect.setFloat(\"edgeIntensity\", this.edgeIntensity);\r\n effect.setFloat(\"edgeWidth\", this.edgeWidth);\r\n effect.setColor3(\"edgeColor\", this.edgeColor);\r\n\r\n const normalTexture = this._geometryBufferRenderer!.getGBuffer().textures[1];\r\n const depthTexture = this._geometryBufferRenderer!.getGBuffer().textures[0];\r\n\r\n effect.setTexture(\"normalSampler\", normalTexture);\r\n effect.setTexture(\"depthSampler\", depthTexture);\r\n\r\n const h1 = new RenderTargetTexture(\"h1\", { width: this.width, height: this.height }, scene, {\r\n samplingMode: Constants.TEXTURE_NEAREST_NEAREST,\r\n generateMipMaps: false,\r\n generateDepthBuffer: false,\r\n type: Constants.TEXTURETYPE_HALF_FLOAT,\r\n });\r\n\r\n switch (this.renderMode) {\r\n case 0:\r\n break;\r\n case 1:\r\n effect.setTexture(\"textureSampler\", this._geometryBufferRenderer!.getGBuffer().textures[1]);\r\n effect.setFloat(\"edgeWidth\", 0);\r\n break;\r\n case 2:\r\n effect.setTexture(\"textureSampler\", this._geometryBufferRenderer!.getGBuffer().textures[0]);\r\n effect.setFloat(\"edgeWidth\", 0);\r\n break;\r\n case 3:\r\n effect.setTexture(\"textureSampler\", h1);\r\n break;\r\n }\r\n effect.setInt(\"renderMode\", this.renderMode);\r\n };\r\n }\r\n }\r\n\r\n /**\r\n * Support test.\r\n */\r\n public static get IsSupported(): boolean {\r\n const engine = EngineStore.LastCreatedEngine;\r\n if (!engine) {\r\n return false;\r\n }\r\n\r\n return engine.getCaps().drawBuffersExtension;\r\n }\r\n\r\n /**\r\n * @internal\r\n */\r\n public static override _Parse(parsedPostProcess: any, targetCamera: Camera, scene: Scene, rootUrl: string) {\r\n return SerializationHelper.Parse(\r\n () =>\r\n new EdgeDetectionPostProcess(\r\n parsedPostProcess.name,\r\n scene,\r\n parsedPostProcess.options,\r\n targetCamera,\r\n parsedPostProcess.renderTargetSamplingMode,\r\n parsedPostProcess.textureType,\r\n parsedPostProcess.reusable\r\n ),\r\n parsedPostProcess,\r\n scene,\r\n rootUrl\r\n );\r\n }\r\n}\r\n\r\nRegisterClass(\"BABYLON.EdgeDetectionPostProcess\", EdgeDetectionPostProcess);\r\n"]}
|
@@ -0,0 +1 @@
|
|
1
|
+
export * from "./edgeDetectionPostProcess";
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../dev/postProcesses/src/edgeDetection/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from \"./edgeDetectionPostProcess\";\r\n"]}
|
package/index.d.ts
CHANGED
package/index.js
CHANGED
package/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../dev/postProcesses/src/index.ts"],"names":[],"mappings":"AAAA,+CAA+C;AAC/C,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC","sourcesContent":["/* eslint-disable import/no-internal-modules */\r\nexport * from \"./asciiArt/index\";\r\nexport * from \"./digitalRain/index\";\r\n"]}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../dev/postProcesses/src/index.ts"],"names":[],"mappings":"AAAA,+CAA+C;AAC/C,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC","sourcesContent":["/* eslint-disable import/no-internal-modules */\r\nexport * from \"./asciiArt/index\";\r\nexport * from \"./digitalRain/index\";\r\nexport * from \"./edgeDetection/index\";\r\n"]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@babylonjs/post-processes",
|
3
|
-
"version": "7.31.
|
3
|
+
"version": "7.31.1",
|
4
4
|
"main": "index.js",
|
5
5
|
"module": "index.js",
|
6
6
|
"types": "index.d.ts",
|
@@ -18,7 +18,7 @@
|
|
18
18
|
"postcompile": "build-tools -c add-js-to-es6"
|
19
19
|
},
|
20
20
|
"devDependencies": {
|
21
|
-
"@babylonjs/core": "^7.31.
|
21
|
+
"@babylonjs/core": "^7.31.1",
|
22
22
|
"@dev/build-tools": "^1.0.0",
|
23
23
|
"@lts/post-processes": "^1.0.0"
|
24
24
|
},
|