Jump to content

Texture over Color


Recommended Posts

Hey folks,


I just wanted to place an svg with transparency over a green base material. I added the diffuseColor and the diffuseTexture and then set the diffsueTexture.hasAlpha to true. I assumed the texture would be over the color... but it ain't. The texture gets tinted and where the texture has transparency the mesh is transparent... but that's not what I want :P


Here is a playground where I tired. What I want: a green sphere with leaves drawn on top without having to create a second slightly bigger sphere or something like that.




How could I achieve that? Should be easy, right? But I have no idea what I am doing wrong :(

Link to comment
Share on other sites



Diffuse color & texture are multiplied (including vertices colors since recently) to obtain the final diffuse color. So you cannot simply obtain what you want the way you planned it.


Basically you want to have two different layers. I think the simplest solution would be to have two spheres, one slightly bigger than the other. I thought there would be a workaround by putting the svg shape in the emissiveTexture slot so that it renders on top of the background, but I don't think it would work for you: http://www.babylonjs-playground.com/#1JW2TH#1


As you can see, the emissive texture is blended additively to the diffuse layer (which means no way to have black parts for example).

Link to comment
Share on other sites

Hmm, I see. Well, I guess I'll use the extra mesh then to overlay the texture.


Wouldn't it be nice if it could be configured with an extra parameter when creating the texture if it is blended by multiplying or additively? Or is that not possible?

Link to comment
Share on other sites

Well I guess you can always suggest it here: https://babylonjs.uservoice.com/forums/267546-general


But I have to say it would feel 'non-canonical' (as well as probably hard to code). A material's emissive color is supposed to be added to the diffuse one, just as the diffuse color is multiplied by the received light. I believe the StandardMaterial should stick to its role of providing a realistic rendition of any kind of real world material.


Another solution would be to create your own shader for this specific use, which can probably be a good thing if you don't need all the StandarMaterial bells&whistles. You'll then be able to merge different layers exactly in the way you want it!

Link to comment
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.

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.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...