jPCT - a 3d engine for Java => Support => Topic started by: Wojtek on February 07, 2010, 01:40:56 am

Title: Question about transparency
Post by: Wojtek on February 07, 2010, 01:40:56 am

I have a problem with setting correct transparency value for billboard image.
I have a spherical object that displays the galaxy background (stars etc) and a flat object with billboard flag (moon) that is closer to the camera than galaxy background.
The moon has transparency set to 255 and the texture image has fully transparent corners (to make moon round) and non transparent center (moon globe). The problem is that the stars from background image are rendered over moon surface (which should not happen, because moon should fully cover the background). Please see the screenshot.
Do you have any idea what could be wrong? I cannot set the transparency to -1 for moon object because the texture corners will be displayed :(
I can add that I am rendering it with hardware renderer.

Title: Re: Question about transparency
Post by: .jayderyu on February 07, 2010, 03:28:44 am
Well I can offer some advice to keep in mind. Though I don't know if it will help.

When using alpha textures(ie textures that have alpha value) the transparency works from 0-255. You got this part fine. What I learned the hard way was that GL or JPCT doesn't use 0-255 transparency. It's 0-1, with 0 being 0% and 1 being 100%.

I don't know if this knowledge will help. But I hope it's something you can work with.

To me it looks like the stars are showing through the billboard. maybe you can turn of transparency in the billboard to see if the layering is right?

btw way nice screenshot :) i'm sure it will look fantastic when everything is working right :)
Title: Re: Question about transparency
Post by: paulscode on February 07, 2010, 11:28:44 am
This isn't an exact answer to your question, but another way to accomplish this effect is to use a texture without alpha information.  Instead use black (color 0,0,0) for the transparent part around the outside of the planet image.  Then create your planet Object3D without alpha, and setTransparency to some high number (say 100).  This will make all the black areas completely transparent, and all the non-black areas completely opaque.  I've tested this method in GL software and hardware rendering modes.

Example applet (http://www.paulscode.com/source/Transparency/TreeViewer.html)  (source code (http://www.paulscode.com/source/Transparency/TreeViewerSource.zip))

I was too lazy to draw a planet for the above example applet - I just threw together a tree model, sky sphere, and star tile background that I had sitting around from other projects, but the transparent areas around the tree's leaves are the same thing that you are trying to do for the transparent areas around your planet.

Note, if there are other opaque areas of your texture that are currently 0,0,0, you'd need to change them to some other black (say 5,5,5).
Title: Re: Question about transparency
Post by: Wojtek on February 07, 2010, 01:49:56 pm

Thank you for your posts (well I am glad that you like the screenshot ;)).
Your posts helped me with solving the problem. There was two things that caused it.
The first one was that my objects had Object3D.TRANSPARENCY_MODE_ADD flag applied that made the stars showing through the billboard no matter of transparency value.

To solve it, I have removed that flag (so default mode is on now) and set the billboard transparency to 255 (at least Object3D.setTransparency() accepts values bigger than 1. When it was 1, the object was still transparent).

The other thing is that I did not have to remove alpha information from image and make invisible pixels black - it also works well with "new Texture(textureId, true)" :)

There is a screenshot:

Title: Re: Question about transparency
Post by: .jayderyu on February 08, 2010, 11:42:21 pm
yeah, i'm not sure what parts use 0-1 and what uses 0-255. I just remember while trying to get filmgrain working right alpha was based on 0-1 not 255.

I'm glad you found the problem. The picture looks nicer now :)