setVerticesData UV issues with Safari browser

I am having issues with using the setVerticesData UV settings in the Safari browser. In the example playground I created, the column on the LEFT does not show up in Safari browsers. I tried an iPad with the newest version of iOS (17.2.1) and a 2015 MacBook Pro with Monterey. Both columns show as expected in Firefox (Windows 10 & 7) and Microsoft Edge.
The difference between the two columns is the one on the LEFT uses setVerticesData on UV coordinates. The RIGHT column uses only front/back UV settings in the MeshBuilder command.

Am I doing something incorrectly or is this a Safari issue with no work around or is it a BabylonJS bug?

frontUVs and backUVs are Vector4, not an array of numbers. See Different Textures On The Front And Back Of A Mesh | Babylon.js Documentation

Because of the wrong format you use, some numbers ar NaN in the vertex buffer, which seems to not bother Chrome and Firefox for some reasons, but make Safari fail. In any case, it’s a mistake in the parameters, you should fix it to make it work on all browsers.

1 Like

Thanks for the reply. Unfortunately, this does not seem to be the solution to the problem.

I initially set the front and back UVs using a Vector4 in a new PG (https://playground.babylonjs.com/#VSHY70#18), but the setVerticesData then makes it not work. Just to be sure, I also added in the setVerticesData on the plane in the RIGHT column (which was working) and it no longer displays in Safari.

I’ll do a little more testing, but I think I’m going to submit this as a bug.

Evgeni_Popov Your response gave me the idea to read what the values are for the working and NON-working versions.

I got these values. The WORKING vertex values seemed to be doubled up (16 elements), where the NON_WORKING values have only 8 elements. This was quite unexpected.

Not Working vertices:0,0,1,0,1,1,0,1
Working vertices:0,0,1,0,1,1,0,1,0,0,1,0,1,1,0,1

As you are setting the mesh as “double sided”, the geometry is doubled (you get 8 vertices instead of 4). So, you also have to double the uv set:

But I’m setting FRONT with Vector4 (4 elements) and the BACK with Vector4 (4 elements). Do FRONT and BACK not mean what I think they mean?

That DOES work in Safari by the way. THANK YOU! But I just don’t understand why.

I think so :slight_smile:

These are not the (u,v) coordinates that are stored in the vertex data. They serve to define a rectangle inside the texture. If the values are (a,b,c,d), (a,b) is the bottom/left corner, and (c,d) the top/right corner. From these values, the (u,v) coordinates of the face are generated =>(a,b), (a,d), (c,d) and (c,b).

1 Like

OMG, that’s embarrassing! I just realized my mistake while explaining this situation to my 11 year old son while we’re doing geometry proofs. I ran to my computer to erase my post, but you already answered.:sweat_smile:

Thank you so much for your help!

I love your avatar BTW! Your Tomb Raider website is pretty cool, too, though I was hoping I was going to be able to play it.

Strange how it works on other browsers but NOT on Safari. Safari is less tolerant of goofy mistakes.