Transparency order problem on png textures
#1
Hello,
I'm trying to make a scene with multiple visuals with transparent png textures, but I got a problem with the sorting of the textures.
Can you help me?

I also tried to use the TransparencySorter, with no success:
Quote:sorter = new Ab3d.Utilities.TransparencySorter(this.MainViewport);
sorter.StartSortingOnCameraChanged();

[Image: http://i.imgur.com/T5sDa0bl.png]
http://i.imgur.com/T5sDa0bl.png

PHP Code:
<Border Grid.Column="1" Grid.Row="0" Grid.RowSpan="2" Name="ViewportBorder" Background="White">
            <
dxControls:DXViewportView Name="MainDXViewportView" PresentationType="DirectXOverlay" BackgroundColor="#5F5F5F" DXSceneDeviceCreated="MainDXViewportView_DXSceneDeviceCreated">
                <
Viewport3D Name="MainViewport">
                    <
visuals:PlaneVisual3D Material="http://www.freeiconspng.com/uploads/bubble-png-9.png" Size="75 75" CenterPosition="0 100 0"></visuals:PlaneVisual3D>
                    <
visuals:PlaneVisual3D Material="http://www.freeiconspng.com/uploads/bubble-png-9.png" Size="100 100" CenterPosition="0 0 0"></visuals:PlaneVisual3D>
                    <
visuals:PlaneVisual3D Material="http://www.freeiconspng.com/uploads/bubble-png-9.png" Size="50 50" CenterPosition="0 200 0"></visuals:PlaneVisual3D>
                </
Viewport3D>
            </
dxControls:DXViewportView>
        </
Border>
        <
cameras:TargetPositionCamera Name="Camera1" Heading="0" Attitude="-90" Bank="0" ShowCameraLight="Always"
                             
TargetViewport3D="{Binding ElementName=MainViewport}" CameraType="PerspectiveCamera" />

        <
ab3d:MouseCameraController Name="MouseCameraController1" 
                                    
RotateCameraConditions="LeftMouseButtonPressed"
                                    
MoveCameraConditions="LeftMouseButtonPressed, ControlKey"
                                    
TargetCamera="{Binding ElementName=Camera1}"
                                    
EventsSourceElement="{Binding ElementName=ViewportBorder}"/> 
#2
You have found two issue with TransparencySorter:

1) Objects that have bounding box with one component equal to 0 (for example SizeY == 0) are not sorted by camera distance.

2) Materials with ImageBrush are not considered as transparent materials. Currently transparent materials are only materials that have SolidColorBrush with alpha color less than 255 or Material that have Brushes with Opacity < 1.


I will improve that in the next version of Ab3d.PowerToys.

Though I am not yet sure how to know if BitmapImage have some transparent pixels - but I will probably consider all BitmapImages with Bgra32 format as transparent. I will also provide a property that will allow disabling that.

I also plan to further allow customizing the TransparencySorter with changing some methods to be virtual. Also it will be possible to sort a list of 3D models.


But you do not need to wait for a new version. To make the current version (7.6) of TransparencySorter work, you can apply the following two workarounds:

1) Change the Normal of the PlaneVisual3D from default value (0,1,0) to something like Normal="0.0001 0.9999 0" - this will just slightly increase the SizeY value of the bounds so that the object will not be rejected.

2) Set Opacity on ImageBrush to a value lower than 1 - for example to 0.99.

The later will require to use the standard WPF way to define DiffuseMaterial in XAML (instead of using a MaterialConverter that comes with Ab3d.PowerToys). So instead of:

Material="http://www.freeiconspng.com/uploads/bubble-png-9.png"

You will need to define the material like so - I defined it only once in Page.Resources:
Code:
<Page.Resources>
    <DiffuseMaterial x:Key="TransparentMaterial">
        <DiffuseMaterial.Brush>
            <ImageBrush Opacity="0.99">
                <ImageBrush.ImageSource>
                    <BitmapImage UriSource="http://www.freeiconspng.com/uploads/bubble-png-9.png"></BitmapImage>
                </ImageBrush.ImageSource>
            </ImageBrush>
        </DiffuseMaterial.Brush>
    </DiffuseMaterial>
</Page.Resources>

Then the material can be used as:
<visuals:PlaneVisual3D Normal="0.0001 0.9999 0" Material="{StaticResource TransparentMaterial}" BackMaterial="{StaticResource TransparentMaterial}" Size="50 50" CenterPosition="0 40 0"></visuals:PlaneVisual3D>

Note that I have also set the BackMaterial to the same material - this is usually best when showing transparent objects.


After that changes the TransparencySorter will correctly sort the objects.
Andrej Benedik
#3
hi, I have had an issue for some time now regarding png and transparency.  I believe I contacted you a long time ago regarding this, apologies for the long time its taken to find a resolution to this.  

I have version 8.2.6863.1045 installed (have also tried the most recent build)

I am using a plane onto which I place a png which is this:

.png   CrossHairGreenGreen.png (Size: 8.49 KB / Downloads: 35)

I am using this png to represent a user defined point on the screen. I rotate the png so that it always faces the camera and scale it so that point is always the same size in the view irrespective of the zoom level.  This all works very well.  The issue I have is that the transparency sorting doesn't always detect the transparent part of the png and displays it as white.  It does however sometimes work.

i use the following code to create the transparency sorter:

_transparencySorter = new TransparencySorter(_main3DView.MainViewport, _mainCamera)
            {
                CameraAngleChange = 5.0,
                SortingMode = TransparencySorter.SortingModeTypes.Simple,
                 ConsiderNonSolidColoredBrushesAsTransparent = true
                
            };
            _transparencySorter.Sort();
            _transparencySorter.StartSortingOnCameraChanged();

However I get results like the attached image. This only happens when I fade the other models out i.e. set their opacity to less than 1 and then rotate.

The process appears to be:  I load the 3D scene and add some points, transparency all works fine, not white backgrounds.  I then have a slider control whcih I use to fade the instrument out i.e. set the opacity.  Then when I rotate the view the pngs no longer have the transparent parts as transparent.  I'm guessing before I slide the slider, nothing is transparent and so different code is called.

How it should look:
   
How it looks after fade and rotate:
   
#4
The problem here is probably that the bounding box of the bigger object is closer to the camera then the individual plane objects and this then leads to invalid order of objects.

For such easy scenarios I would recommend that you do not use the TransparencySorter but manually sort the objects. Just define a ModelVisual3D for the transparent planes and make it the last in the Viewport3D.Children. Then put the planes into that ModelVisual3D. If you also want that the planes are correctly visible through other planes, then you can also easily sort the planes inside that ModelVisual3D - just calculate the distance from the plane to the camera's position (call camera.GetCameraPosition) and sort by that distance.
Andrej Benedik
#5
hi thanks for the reply.  I think after some further investigation I can't see how the issue it to do with order.

There are two scenarios, first if I put the points at the end of the Children List I get the points drawn as they should (no white box) but they disappear behind the other models when the models are transparent.  They should not disappear. 

2nd I put the put the points at the start of the children list, now the points are drawn with a white square around them and do not disappear when behind the other models if they are transparent. That is correct but why is it drawing the white square i.e. not considering the transparent part of the png?

Not sure I understand how to solve this.
#6
I have managed to get around this issue by other means, instead of using a plane and depend on the transparent part of the png to be rendered as transparent, I have created a mesh that exactly matches the shape of the non-transparent parts of the png. this then makes it possible to just put the points at the start of the visual3d list and avoid using the transparency sorter as you suggest.
#7
Tim, this is a great solution!

When you can create a 3D shape that matches the non-transparent parts, this is much better because GPU can handle that in any case and the result does not depend on the order of 3D models.
Andrej Benedik
  


Forum Jump:


Users browsing this thread:
1 Guest(s)