simon_bg

Combining multiple layers of textures

Recommended Posts

Hi everyone!

Is there any way in Babylon.js to combine multiple textures, or multiple materials on a single mesh?
I know that it's possible to apply diffuseTexture and ambientTexture on a material at once, but if I have more than 2 textures?

Like for example, it could be used for maps, having a satellite image as a base texture and then applying a layer with ambient pressure, and UV index, and wind direction, and whatnot :)

Share this post


Link to post
Share on other sites

hi  i just wanna help you to make shader .

http://playground.babylonjs.com/#1SZK02#0 need  click in run   (PG Bug) after load for see material

i have some useful method for combine materials  and replace color

you can use it like this 

 
mesh.material = eash.shader(
		eash.multi(
			[
			  "result = vec4(1.,0.,0.,1.);", /*Red color*/
			  "result = vec4(0.,0.,1.,1.);", /*blue color*/
			] /* array of material you want */,
			true /* true for combine  & false for append */) /*combine red with blue = pink*/
		, scene);

 

http://playground.babylonjs.com/#1SZK02#1 need  click in run after load for see material

http://playground.babylonjs.com/#1SZK02#5 need  click in run after load for see material

you just need make vec4 color and set it in in result more

mesh.material = eash.shader(
		eash.multi(
			[
			    "result = vec4(1.,0.,0.,1.);",
				"result = vec4(0.,0.,1.,1.);"+
				eash.fresnel({ color: 0xffffff, dark: false }) ,
				eash.map({ref1:'w.jpg'})
			] /* array of material you want */,

			true /* true for combine  & false for append */)
		, scene);

http://playground.babylonjs.com/#1SZK02#7 need  click in run after load for see material

you can control all part opacity too just need change part structer to this

"result = ..." => {r:"result = ...",e:0.1 /*0 .. 1.*/}

mesh.material = eash.shader(
		eash.multi(
			[
			    "result = vec4(1.,0.,0.,1.);",
				"result = vec4(0.,0.,1.,1.);" +
				eash.fresnel({ color: 0xffffff, dark: false }) ,
				{ r: eash.map({ ref1: 'w.jpg' }), e: 0.1 }
			] /* array of material you want */,

			true /* true for combine  & false for append */)
		, scene);

http://playground.babylonjs.com/#1SZK02#8

for replace i just make a short sample but if it you want i can explain more

in this case you change all red color with other material

http://playground.babylonjs.com/#1NDRAR#0

we work on ts version for replace eash with BABYLON.MaterialBuilder in 2.4 BJS

sadasd.jpg.b9ff5f6907cb2c59df979465b921a

http://playground.babylonjs.com/#1NDRAR#1

if it is not help just say me what you need i make your shader by eash and share it in cyos :)

Share this post


Link to post
Share on other sites

Wow thanks, NasimiAsl! I tried it out and it's amazing! I probably would've spent hours trying to make a shader from scratch.
 

1 hour ago, NasimiAsl said:

we work on ts version for replace eash with BABYLON.MaterialBuilder in 2.4 BJS

Really looking forward to this!

Share this post


Link to post
Share on other sites

Congrats, Nasi!  Power contributor!  Gold star!

Now, let's talk marketing.  First... your name.  It's a perfectly nice name, but when I say it in English, people reply with "bless you" and "gesundheit".  :)  They think that I sneezed!

So, I'm thinking maybe change it to...  Shannon Shadero... but folks just call you "Shady".  Wha-da-ya think?  You need a Hollywood stage name... so you are ready for the super-stardom that comes with being a power contributor.  :)   But, if that new name is too much different from your normal name, then perhaps... "Naz"? 

Naz Shadero... race car driver, jet fighter pilot, shader programmer, secret agent, lady-killer, and all-around nice guy.  Yeah, now we got some "Movie Star" happening here.  heh

Now... "eash".  Every time I say that word, I accidentally spit.  That's telling me something important.  How about "EZshade", or maybe just EZS.   GPUtiful! 

Okay, okay, maybe 'eash' is fine... but... it seems I remember saying that word... sometimes... after I vomit.  I don't know how nice that will "look" on the Hollywood posters.  B)

"Ladies and gentlemen... tonight... Naz Shadero Productions presents... something mysterious, something powerful, something amazing!  Tonight... we are proud and honored to present...

EASH!

No, we will need to change that.  Sorry. :D

I'm just having some fun with you, Naz.  But... you know... you need a stage name... and some glitter.  :)  You're star-bound!

Share this post


Link to post
Share on other sites

THANKS ALL :) (@WIN just choose one name :) for me first )

i need two names for eash first is MaterialBuilder but next for inside of parameters

" new BAYBYLON.MaterialBuilder(  (????).multi( ... ) , scene);"

help me choose one name for that ( seriously ) :)

@Deltakosh any idea for fix first error in PG (need call createscene function after js load i think )

Share this post


Link to post
Share on other sites

Eash is so powerful and simple : the genuine BJS spirit !

And please, NasimiAsl, keep your own name :-) 

If you make a good product everyone will know your real name and remind it whatever the language where it is used.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.