How to enable transparency(or Alpha blending) in Point cloud


I am implementing a requirement where a point cloud must appear as a circle instead of a square.

For this,

  1. I created a custom mesh and applied a shader material with pointsCloud=true.
  2. I implement a simple circle fragment shader where the inner color is Opaque(Aplha = 1.0), and the outer color is transparent (Aplha = 0.0).

For some reason, the mixing of two colors in not result in a proper alpha blending or transparency. Here is a playground sample.

Expected result:- The fragment outside the circumference area must be transparent and blend with anything in the background.

Any help to make the transparency work is highly appreciated.

You have to add needAlphaBlending: true in the ShaderMaterial constructor options:


Thanks for enough hinting at the problem.
In addition, alphaMode and alpha fixes the issue.

    customMesh.material.alphaMode = BABYLON.Engine.ALPHA_COMBINE;
    customMesh.material.alpha = 0.0;