You are not logged in.

zFilter 2 - WebGL Postprocessing Plugin

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

  • 1
  • 2

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

1

Thursday, January 30th 2020, 3:57pm

zFilter 2 - WebGL Postprocessing Plugin

This is the zFilter 2 - WebGL Postprocessing Plugin Thread



zFilter is a postpocessing WebGL shader plugin for dynamic effects on your panorama image,
layers and hotspots. It allows you to add visual effects for startup intros, scene changes,
information popups, etc. Setting or tweening simple attributes adjusts the brightness,
saturation or blurs your panorama, layers or hotpots!

zFilter 2 Release :
filter support for layers and hotspots !
a fast gaussian blur shader fblur (fastblur) !
new fun shaders swirl, pixelate, ripple and split !
support for krpano 1.20 order and phase !
improved editor and new live examples
more features and lower price :) !

more infos below in this thread or on the plugin page :
https://krpano.com/plugins/userplugins/zfilter
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 4 times, last edit by "indexofrefraction" (Feb 2nd 2020, 10:12am)

jeromebg

Professional

Posts: 1,113

Location: Angers - France

Occupation: 360 experiences creator

  • Send private message

2

Thursday, January 30th 2020, 6:32pm

Sounds great !
Are you sending update to old customers ?

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

3

Friday, January 31st 2020, 9:34am

Hi Jerome,

Yes, all existing customer will get the update for free.

I did a last check now and when the documentation is online,
i'll send out the new builds.

and maybe to explain the main updates in zfilter 2 :

- the new fblur shader performs much faster and works great in low performance situations
- the layer / hotspot filters allow for example blurring simply like set(layer[xyz].blur, 10);
- the support for kprano 1.20 phase allows to blur the pano, but not the hotspots
- the support for kprano 1.20 order and a new internal order allow new looks by order changes
- and ofc those fun shaders work great for transitions or intro effects

best, index
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 1 times, last edit by "indexofrefraction" (Feb 1st 2020, 11:17am)

igor.socha

Intermediate

Posts: 200

Occupation: Photographer

  • Send private message

4

Friday, January 31st 2020, 2:15pm

Great, thanks!
Best regards,
Igor Socha

Tuur

Sage

Posts: 3,737

Location: Netherlands

Occupation: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

  • Send private message

5

Saturday, February 1st 2020, 9:38am

Yeahh!
*cool*
Bring it on!

Tuur *thumbsup*
https://www.virtualtuur.com
Panimator: https://krpano.com/plugins/userplugins/panimator/#top
ToolBox: https://bit.ly/3TTnd6U
Measure in 360 photos : https://pame.virtualtuur.com
Moving Hotspots V2: https://krpano.com/plugins/userplugins/movinghotspots/#top
Donations
https://bit.ly/3NnpynC

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

6

Sunday, February 2nd 2020, 10:01am

ok the updated plugin page is online now, thanks Klaus !

for existing and possible new users, please check out the new documentation
there are a lot of new live examples where you can play around,
and explore the abilities and performance of zfilter.

https://krpano.com/plugins/userplugins/zfilter

of course i'm always happy for feedback,
or if you have questions, you can post them here in the plugin thread.

also, if you have some nice, finished tours using zfilter, please post your links :)

best, index
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 1 times, last edit by "indexofrefraction" (Feb 2nd 2020, 10:24am)

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

7

Sunday, February 2nd 2020, 10:26am

to existing users :

I will try to send all updates out to the existing users today.
if you didnt receive anything until tonight, please check your spam folders.
specifically gmail ignores / spam filters anything that mentions a zip file !

and lastly as info :
you should not need to change your tours to update,
everything works the same, the new features are all additional.
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 2 times, last edit by "indexofrefraction" (Feb 2nd 2020, 10:56am)

juyatu

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

  • Send private message

8

Monday, June 1st 2020, 11:50am

Zfilter_editor have some problems in use

1, because zfilter_editor encrypted, I need to translate English into Chinese, very difficult.
2, when I put the zfilter_editor_target set hotspot [name], how do I set can change for the adjustment of the scene.
3, when zfilter_editor_target from a hotspot to another hotspot, the editor didn't follow change, seems to be only the initial state, and can't read the target parameters.
*thumbup*

Preload Plugin (Free, source code)
Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

微信：Eric_Chen1990

This post has been edited 3 times, last edit by "juyatu" (Jun 1st 2020, 1:33pm)

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

9

Monday, June 1st 2020, 10:56pm

hi, juyatu

the zfilter editor was never meant for public use, it is just a tool to find and test filter values.

but based on this official example
https://krpano.com/releases/1.20.7/examp…der-blend-cubes

here a small example to create your own sliders, with chinese text

Source code

 
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

<krpano>

	<plugin name="zfilter" url="plugins/zfilter.js" preload="true" keep="true"
			fquality.mobile="5" fquality.tablet="10" fquality.desktop="15" />

	<view hlookat="0" fov="90" fovmin="60" fovmax="120" />

	<image>
		<sphere url="pano/lady_elliot.jpg"/>
	</image>

	<layer name="slider_bg" type="container" bgcolor="0x000000" bgalpha="0.5" align="topleft" x="30" y="30" handcursor="false" width="220" height="18" />
	<layer name="slider_title" type="text" align="topleft" html="saturation / 饱和" parent="slider_bg" bg="false" css="color:#fff;font-size:10px;padding-left:5px;" alpha="0.5" enabled="false" />
	<layer name="slider_grip" type="container" bgcolor="0xffffff" bgalpha="0.5" align="left" edge="center" parent="slider_bg" x="110" width="10" height="18" bgcapture="true"
	       ondown="copy(drag_currentx, x); copy(drag_stagex, mouse.stagex);
	               asyncloop(pressed,
	                 calc(newx, drag_currentx + (mouse.stagex - drag_stagex));
	                 clamp(newx, calc(layer[slider_grip].width/2), calc(layer[slider_bg].pixelwidth - layer[slider_grip].width/2));
	                 copy(x, newx);
	                 calc(valx, (newx - layer[slider_grip].width/2) / (layer[slider_bg].pixelwidth - layer[slider_grip].width));
	                 calc(valx, valx * 2 - 1);
	                 copy(plugin[zfilter].saturation, valx);
	               );"
			/>

</krpano>
zFilter plugin -- zFlare plugin -- zSnapshot plugin

juyatu

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

  • Send private message

10

Tuesday, June 2nd 2020, 3:19am

Zfilter_editor target

<set var="zfilter_editor_target" val="layer[popup]"/>
If i create my own editor，how can i change the target. *confused*
*thumbup*

Preload Plugin (Free, source code)
Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

微信：Eric_Chen1990

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

11

Tuesday, June 2nd 2020, 6:44am

instead of
copy(plugin[zfilter].saturation, valx);
just use
copy(layer[yourlayer].saturation, valx);

or... use a variable
<set var="yourtarget" val="layer[yourlayer]"/>
and
copy(calc(yourtarget + '.saturation'), valx);

and in general...
you do not need that editor target variable to use zfilter
you can just set the values in the xml

Source code

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<action name="setup" autorun="onstart">
	if(plugin[zfilter].ready,
		// add zfilter to layer and hotspot
		addzfilter(layer[mylayer1]);
		addzfilter(layer[mylayer2]);
		addzfilter(layer[mylayer3]);
		addzfilter(hotspot[myhotspot1]);
		addzfilter(hotspot[myhotspot2]);
		addzfilter(hotspot[myhotspot3]);

		set(layer[mylayer1].saturation, -1);
		set(layer[myhotspot2].blur, 10);
		// ... etc
		set(plugin[zfilter].brightness, 0.5);
	);
</action>


ps. just in case you dont know...

<set var="yourtarget" val="layer[yourlayer]"/>
can be changed in an action like
set(yourtarget, layer[otherlayer]);
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 1 times, last edit by "indexofrefraction" (Jun 2nd 2020, 8:20am)

juyatu

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

  • Send private message

12

Tuesday, June 2nd 2020, 8:33am

Thank you very much!
I know how to do it. I am doing own hotspot editor, dynamically to add some furniture pictures, add zfilter is to adjust the brightness and color.
*thumbup*

Preload Plugin (Free, source code)
Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

微信：Eric_Chen1990

juyatu

Trainee

Posts: 64

Location: China

Occupation: Krpano custom coding

  • Send private message

13

Friday, October 30th 2020, 4:25am

Can I set the center locations of 'ripple' and 'Swirl'?
*thumbup*

Preload Plugin (Free, source code)
Constrast Plugin
KR HLS Plugin
Slider Controller Plugin
KR+Next+MapBox+TS Demo (source code)

微信：Eric_Chen1990

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

14

Monday, November 2nd 2020, 1:56pm

Quoted from "juyatu"

Can I set the center locations of 'ripple' and 'Swirl'?


hi juyatu,
no sorry, atm there is no support for changing the center for swirl / ripple.
best. index
zFilter plugin -- zFlare plugin -- zSnapshot plugin

datofz

Trainee

Posts: 60

Location: Lyon, France

  • Send private message

15

Wednesday, October 13th 2021, 7:27pm

Zfilter for layer image type

Hello,

Good plugin :)
It works for layer image type ?
...for example change color on a basic png picto ?
Thanks
Damien

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

16

Wednesday, October 13th 2021, 7:58pm

hi dafoz,

yes that works, but only with limited filters (brightness, contrast, saturation, hue, sepia and blur) and with renderer=css3d
see here : https://krpano.com/plugins/userplugins/zfilter/#elements
and here: https://krpano.com/plugins/userplugins/zfilter/#purchase

hotspot & layer filters are technically css filters accessible by simple krpano attributes
eg. <layer name="test" blur="10" /> or set(layer[test].blur, 10); or tween(layer[test].blur, 10, 1);

i didn't have the time to fix the ShareIt problem, yet, for the moment if you're interested to buy it, just contact me by pm.

best, index

ps. example is here
https://krpano.com/plugins/userplugins/z…/#example_layer
it would also work for an image layer (<layer name="image" url="image.jpg" ... />)
zFilter plugin -- zFlare plugin -- zSnapshot plugin

datofz

Trainee

Posts: 60

Location: Lyon, France

  • Send private message

17

Wednesday, October 13th 2021, 9:09pm

Thanks ! good !

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

18

Tuesday, December 14th 2021, 11:50am

Ok, the plugin plugin page is finally updated and zFilter is now available via Gumroad
https://krpano.com/plugins/userplugins/zfilter

I had to give up the separate modules, this was not possible with Gumroad.
Existing clients who just bought single modules can upgrade to the full version with a discount of 50%.
There is no public link for this, so please contact me if you want to upgrade.

Furthermore the new zFlare Plugin was released today and can be used together with zFilter. More info here:
https://krpano.com/forum/wbb/index.php?p…&threadID=18621
https://krpano.com/plugins/userplugins/zflare

zFlare and zFilter are separate plugins, but there is a discount if bought as package
Additionally until 31.12.2021 there is a CHRISTMAS DISCOUNT of 20% for all of my plugins !
just enter "xmas21" in the discount field on Gumroad.

.
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 1 times, last edit by "indexofrefraction" (Dec 14th 2021, 4:31pm)

milemann

Trainee

Posts: 132

  • Send private message

19

Wednesday, March 16th 2022, 2:33am

Some hotspots without blur

Hi,

i would like to use blur to all elements (pano,layers, hotspots) after a click on hotspot "make_all_blured" .. but some of the hotspots (lets say "hs1", "hs2" and "stop_ blur") should stay unblured. click on "stop_blur" hotspot should reset the blur.

How to achieve this in a simplest way?

greetz
mil

indexofrefraction

Professional

  • "indexofrefraction" started this thread

Posts: 1,278

  • Send private message

20

Wednesday, March 16th 2022, 7:51am

hi,
this is possible but note: krpano itself only supports blurring all or no hotspots.
the zfilter hotspot blur is based on css and works only with renderer=ccs3d hotspots
if you have a lot of hotspots / layers, doing this may be (very) demanding on your hardware

first set phase=2 to have your hotspots not blurred

Source code

 
1
2

<plugin name="zfilter" ... phase="2" ... />
tween(plugin[zfilter].blur, 10);

now blur your selected hotspots / layers manually :

Source code

 
1
2

addzfilter(hotspot[...]); and tween(hotspot[...].blur, 10);
addzfilter(layer[...]); and tween(layer[...].blur, 10);

to join this you would interate though all your hotspots / layer, skip the unwanted ones,
do addzfilter() for each element and build two string with all names and all blur values, eg
items = "hotspot[aa].blur|hotspot[bb].blur|....|layer[xx].blur|layer[yy].blur|...."
values = "10|10|...|10|10..."
then tween the main blur and the hotspots and layers together
tween(calc("plugin[zfilter].blur|" + items), calc("10|" + values), ...);
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 18 times, last edit by "indexofrefraction" (Mar 16th 2022, 8:25am)

  • 1
  • 2

Similar threads