Sie sind nicht angemeldet.

WebGL createPostProcessingShader returns null

Lieber Besucher, herzlich willkommen bei: krpano.com Forum. Falls dies Ihr erster Besuch auf dieser Seite ist, lesen Sie sich bitte die Hilfe durch. Dort wird Ihnen die Bedienung dieser Seite näher erläutert. Darüber hinaus sollten Sie sich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutzen Sie das Registrierungsformular, um sich zu registrieren oder informieren Sie sich ausführlich über den Registrierungsvorgang. Falls Sie sich bereits zu einem früheren Zeitpunkt registriert haben, können Sie sich hier anmelden.

plasmic

Anfänger

  • »plasmic« ist der Autor dieses Themas

Beiträge: 5

  • Nachricht senden

1

Dienstag, 17. Mai 2016, 16:38

WebGL createPostProcessingShader returns null

Hey All,

I'm new to KRPano so bear with me, i have looked on the forum to find a similar question or maybe even an example but haven't found anything so here we go :)

My goals is to use a blur Filter for the content in the KRPano viewer.

What i've done so far:

1. Created fragment shader in a script tag (https://github.com/mattdesl/lwjgl-basics…fragment-shader ). And retrieved it using a simple

Quellcode

 
1

this._shader = document.getElementById('shader').text;

The `vTexCoord` and `u_texture` are renamed to `tx` and `sm` as described here http://krpano.com/docu/plugininterface/#…rocessingShader

2. Got the WebGLContext by loading a custom plugin.

3. I'm able to call the function to add the Post Processing Shader:

Quellcode

 
1

this._panoWebGLLayer.webGL.createPostProcessingShader(this._shader, 'sm, resolution, radius, dir');


But it still returns null, but without any errors. Has anyone else experienced anything similar and if so, how can i solve this?

Thanks in Advance,

Plasmic

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

2

Dienstag, 24. Mai 2016, 19:45

Hi,

making a blur filter is possible this way and I'm already working on providing examples and more information for that.

Attached here a preliminary plugin example of a simple sharpen filter:
postprocessing-sharpen-filter.zip

Best regards,
Klaus

plasmic

Anfänger

  • »plasmic« ist der Autor dieses Themas

Beiträge: 5

  • Nachricht senden

3

Donnerstag, 26. Mai 2016, 14:11

Hi Klaus,

Thanks for your reply. With the example you've provided i was able to make it work, Thanks!

Cheers,

Plasmic

nosferatu

Schüler

Beiträge: 80

Wohnort: Ukraine

  • Nachricht senden

4

Mittwoch, 5. April 2017, 16:00

Hi Klaus!

I tried to realize the effect of blurring based on the above link - https://github.com/mattdesl/lwjgl-basics…fragment-shader
but I get strange stripes.



Here is my code:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

return "\
	precision mediump float; \
	varying vec4 vColor; \
	varying vec2 tx; \
	uniform sampler2D sm; \
	uniform float resolution; \
	uniform float radius; \
	uniform vec2 dir; \
	\
	void main() {  \
		vec4 sum = vec4(0.0); \
		vec2 tc = tx; \
		float blur = radius/resolution;  \
		\
		float hstep = dir.x; \
		float vstep = dir.y; \
		\
		sum += texture2D(sm, vec2(tc.x - 4.0*blur*hstep, tc.y - 4.0*blur*vstep)) * 0.0162162162; \
		sum += texture2D(sm, vec2(tc.x - 3.0*blur*hstep, tc.y - 3.0*blur*vstep)) * 0.0540540541; \
		sum += texture2D(sm, vec2(tc.x - 2.0*blur*hstep, tc.y - 2.0*blur*vstep)) * 0.1216216216; \
		sum += texture2D(sm, vec2(tc.x - 1.0*blur*hstep, tc.y - 1.0*blur*vstep)) * 0.1945945946; \
		\
		sum += texture2D(sm, vec2(tc.x, tc.y)) * 0.2270270270; \
		\
		sum += texture2D(sm, vec2(tc.x + 1.0*blur*hstep, tc.y + 1.0*blur*vstep)) * 0.1945945946; \
		sum += texture2D(sm, vec2(tc.x + 2.0*blur*hstep, tc.y + 2.0*blur*vstep)) * 0.1216216216; \
		sum += texture2D(sm, vec2(tc.x + 3.0*blur*hstep, tc.y + 3.0*blur*vstep)) * 0.0540540541; \
		sum += texture2D(sm, vec2(tc.x + 4.0*blur*hstep, tc.y + 4.0*blur*vstep)) * 0.0162162162; \
		\
		gl_FragColor = vec4(sum.rgb, 1.0);  \
	}"

Quellcode

 
1
2
3

krpano.webGL.context.uniform2f(shader.dir, 1, 0);
krpano.webGL.context.uniform1f(shader.resolution, 1024);
krpano.webGL.context.uniform1f(shader.radius, 20);

Quellcode

 
1

shader = krpano.webGL.createPostProcessingShader( get_shader_src(), "sharpen_factor,sz,dir,resolution,radius");


Could you tell me what I'm doing wrong?
Thank you!

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von »nosferatu« (6. April 2017, 09:09)

nosferatu

Schüler

Beiträge: 80

Wohnort: Ukraine

  • Nachricht senden

5

Donnerstag, 6. April 2017, 09:47

I fixed some bugs in the code and edited my post above.
Yet I do not get the desired result.

Once I write the variable "vColor", I get a black screen:

Quellcode

 
1

gl_FragColor = vColor * vec4(sum.rgb, 1.0);

Without this variable I get a strange effect:

Quellcode

 
1

gl_FragColor = vec4(sum.rgb, 1.0);

Help me please.

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

6

Freitag, 7. April 2017, 22:53

Hi,

Zitat von »nosferatu«

Could you tell me what I'm doing wrong?
A lot of things are wrong there: ;-)
  • your shader code is from a two-pass shader example, so one pass can't be enough
  • the 'resolution' of the framebuffer is not 1024x1024, it's the current krpano rendering buffer size - krpano provides that size via the 'sz' uniform
  • not sure what you want todo with your 'vColor' variable...
I will quickly made a plugin based on your core shader code and then post it here.

Best regards,
Klaus

nosferatu

Schüler

Beiträge: 80

Wohnort: Ukraine

  • Nachricht senden

8

Sonntag, 9. April 2017, 16:58

Klaus, thank you so much for your work!
This is a great plugin!
Now we will do it better of virtual tours.
Wonderful effect for intro.

roladdon

Anfänger

Beiträge: 2

Wohnort: Canada

  • Nachricht senden

9

Montag, 26. März 2018, 23:31

post processing sharpening filter

I am brand new to krpano and made my first 360 video pano with it - works well.
Now I want to try to add a sharpening filter to the running video.
I used the sharpening filter from this forum.

I added to the xml file

<plugin name="sharpen"
devices="html5"
url="%SWFPATH%/plugins/postprocessing.js"
xml_sharpen = "10.0"


/>

But now what? - how can I sharpen the pano video that's running.
I am curious to see if there is enough processing power, and what the effect the sharpening has on a running video.
Thanks for your help.

roladdon

Anfänger

Beiträge: 2

Wohnort: Canada

  • Nachricht senden

10

Montag, 26. März 2018, 23:48

post processing sharpening filter

I just realized my mistake.

I changed to sharpen = "10.0"
I also tried sharpen = "2.0"

I can see the effect on the video.

BUT - this does not seem to sharpen the video

Thanks for your help

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

11

Mittwoch, 28. März 2018, 23:34

Hi,

that sharpen filter example is a very simple one - it has only 1px sharpening radius at screen level - and with that a blurred video will not much get much sharped.

Best regards,
Klaus

Ähnliche Themen