3d object not rendering properly with amd radeon graphics card

[SahilSharma2710]

I have been building a flutter app using three_dart package for almost all platforms . The 3d rendering of my .gltf model is fine in almost all platforms , but it's giving some rendering problems when i am trying to run it on amd radeon graphics card , on the same system when i run it on web it's all fine . this is the system info-

and these are the rendering issue the 3d model and footbal is not rendering on the screen

However ,The output on macos is correct-

Do anybody have an idea about what might be the issue ?? cc @Knightro63

[Knightro63]

Hi @SahilSharma2710,

Sorry to hear you are having an issue. This seems to be a problem with flutter_gl.

https://github.com/wasabia/flutter_gl/issues/48 https://github.com/wasabia/flutter_gl/issues/44

I am unable to support because I do not own any amd machines.

Hope you are able to resolve the issue.

[Knightro63]

Hi @SahilSharma2710,

Have you solved the issue? I was thinking about this issue and remembered something that amd uses 16 bit or 32 bit depth buffer where every-other processor uses 24 bit depth buffer.

In flutter_gl_windows/windows/CustomRender.cpp can you change line 128 GL_DEPTH24_STENCIL8 to GL_DEPTH32_STENCIL8.

[SahilSharma2710]

Thanks for ur time @Knightro63 , the problem is not solved yet. the GL_DEPTH32_STENCIL8 is not seemed to be defined in the header file

Can u tell whats the supposed value

[Knightro63]

Hi @SahilSharma2710,

Sorry its 32F not 32 in the variable GL_DEPTH32F_STENCIL8 or 0x8CAD

[SahilSharma2710]

Hey @Knightro63 i tried this but no lead and there is some thing in the log also , i am not sure if this is related

[JanNilsScheele]

Hey @Knightro63 ,

I have the exact same problem even with the examples of this package. If I open up the 'animation_skinning_blending' for example, it does not render. Strange thing is, if I open it up 3-4 times, suddenly the model appears and renders. I checked the issues mentioned by you and I could fix the flutter_gl problem. But it is not directly applicable to this problem, as it renders after some time. It seems to me that the shaders are lost. Maybe a race condition or some garbage collection? Do you have any idea?

[Knightro63]

Hi @JanNilsScheele,

I am sorry you are having trouble. This is an interesting problem.

1. Are you using Cacheing?
2. Is your os windows and on an AMD processor?
3. Have you tried flutter run -d "device" --release?
4. Does it work on Web?

You might be having some FileLoading issues or Cacheing issues. In your dispose function can you add

  @override
  void dispose() {
    disposed = true;
    THREE.loading = {};
    three3dRender.dispose();
    super.dispose();
  }

This can also be caused by using flutter on computers with low memory. Flutter uses Virtual memory and if you have 4gb of ram I can see this being an issue.

Let me know about the questions I had above to see if I can help.

If you would like to see if it is a Fileloading problem I have been updating a different repo you can check out this, but you might need to do some changes to get it to work. It has not been published yet because I have not finished the documentation and moving the math to googles vector_math repo.

[JanNilsScheele]

Thanks for your quick response! I am indeed using AMD on windows, hence the notion of the releated bugs. Ram should not be an issue on the machine but I will check the other options. I myself did not implement any caching but I see that three_js caches the shaders and programs. The solution works on OSX and on mobile, have not yet tested web. Will keep you posted!

[JanNilsScheele]

Hi @Knightro63 ,

the computer in question has 32gb of ram, shouldn't be a problem. I don't think its the loaders, since the models show up from time to time.

I tested number 3: with the release mode. It made things worse. I used the three_dart/examples multiple-animations and animation_skinning_blending as benchmark.

In debug mode, when I start the animation_skinning_blending 3-4 times from the menu, the model is eventually rendered and the animation is playing. In release mode, the model never shows up.

For multiple-animations: in debug the first 2-3 models appear on the first run, the parrot is sometimes missing. In release mode, none of the models ever shows up.

I continue to think this has something to do with garbage collection or how the shaders are attached and maintained by the gl-program.

The flutter_gl repo has a demo case with code like this:

if (!initShaders(_gl, vs, fs)){ print("Failed"); }

This does not work, until I save the result of the function in a value like this:

final shaderSuccess = initShaders(_gl, vs, fs); if (!shaderSuccess) { print("Failed"); }

First version never renders the triangle, second version always does. I have no Idea why allocated and bound shaders in a sub-function should get "lost" when the return value is not saved. does the function get optimized? Or everything in it garbage collected? Is this also happening in three_dart and why does it only happen on AMD graphic cards?

I'm really lost here.

[Knightro63]

Hi @JanNilsScheele,

This actually makes since. If you take a look at flutters how to write a proper shader. This is one of the examples to avoid. I wondering of they ran into a similar issue.

In three_dart there are a lot of shaders to go through and check if any break the requirements for being successful shaders.

So in the mean time I would like to check if there is another thing wrong that would be easier to check for like WebRenderer Options. Some of these options need to be changed to get certain files to work on certain machines.

    Map<String, dynamic> _options = {
      "width": width,
      "height": height,
      "gl": three3dRender.gl,
      "antialias": true,
      "canvas": three3dRender.element,
      "alpha": false,
      "antialias": true,
      "failIfMajorPerformanceCaveat": false,
      "premultipliedAlpha": true, // might need to be false
      "depth": true,//- whether the drawing buffer has a [depth buffer](https://en.wikipedia.org/wiki/Z-buffering) of at least 16 bits not sure it is for AMD might be 24 try changing this to false
      "precision":  "highp", //Can be "highp", "mediump" or "lowp"
    };

    if(!kIsWeb){
      _options['logarithmicDepthBuffer'] = false; // try this as true just to see as well.
    }

Hope this helps.

[JanNilsScheele]

Hi @Knightro63 ,

thanks for your help, would you mind contacting me directly at [email protected]?

Best regards

[Knightro63]

Hi @JanNilsScheele,

I was able to get it working using Google's angle.

I am not quite done converting everything over but should be done in a couple of more weeks. It has some small issues still but it might work if you don't need shadows or environment maps.

Please go here for the lastest version.

Hope this helps.