Jump to content

Vertex color+alpha+texture


Recommended Posts



Is it possible in BJS to combine the following in the same mesh/material? 

  1.  vertex colors
  2.  vertex alpha
  3.  partially transparent textures [*]
As near as I can tell, vertex colors only display with ambient textures, but texture alpha[*] only works with diffuse textures. So you can get any two of the three, but never all of them at once.


Do I have this right, or is there a combination of settings that would work?



[*] note: BJS seems to have two different kinds of texture alpha - "binary" alpha where each pixel can be on or off but nothing is blended, and "full" alpha where pixels are blended. In this question I'm mainly asking about the binary kind, but either would do.
Link to comment
Share on other sites

I think you can


Here's in an example from this topic : http://www.babylonjs-playground.com/#1MFDDU#7


There is a partially transparent texture (the tree leaf). An "extra" alpha is then applied to the texture opaque parts.


For the vertex color with alpha, it works also. You need to set a Color4 value for each vertex in your vertexData object.

Then set :

mesh.hasVertexAlpha = true

example here : http://www.html5gamedevs.com/topic/12909-volumetric-fog/?p=75178


I don't really how the diffuse texture then combines with the vertex colors.

I just know the different textures (diffuse, opacity, emissive) have each different blendings

Link to comment
Share on other sites

There's the 3 working together: http://www.babylonjs-playground.com/#1MFDDU#9

Sadly, we have to use the ambient texture instead of the diffuse one, because color values are overriden it (source here). I'll suggest DK to change this, in case it's not a specific design choice.


As for transparency and the differences between alpha-test and alpha-blend, I kindly suggest you reading this article which I made lovingly:


Link to comment
Share on other sites

the different textures (diffuse, opacity, emissive) 


Ah, I didn't know there was such a thing as an opacity texture. Combining vertex color + vertex alpha + emissiveTexture + opacityTexture seems to do the trick, at least so far..

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...