Video Texture projects 1 pixel of video when using GLTF Loader

I am trying to project a video texture onto the screen of a mobile device. This was working with a .OBJ importer but when I switched to the GLTF importer, the screen of the phone now, which I grab from matching on the mesh’s name, seems like it’s only playing 1 pixel of the video (at x:0, y:0 of the .mp4).

I played with the wrap settings of the material and the video html tag to no avail, and couldn’t find any similar issues online. Normally I would expect myself to have committed some user error, but the same code is working when the mesh comes from a .obj file rather than a .gltf. Any idea what could be wrong? I’ve attached the assets, html, and js and have been testing with a simple http server pointed in that directory.

See https://threejs.org/docs/#examples/en/loaders/GLTFLoader — you will need to use .flipY = false with GLTFLoader, it is set to true in your code.

2 Likes

Thanks Don! I have flipped Y back to false and am still seeing the same issue, albeit on the other side of the mp4.

One warning the console is throwing is three.js:21370 THREE.WebGLRenderer: Texture has been resized from (300x200) to (256x128). which I am unsure is related… I think that is related to the lens textures projected onto the back camera cylinders of the phone.

Any other ideas of what could be off?

Ok so I compared the 1) .obj screen mesh and 2) the .gltf screen mesh in the scene graph.

Under Mesh --> geometry --> attributes, the OBJ imported geometry has a “uv” attribute whereas the GLTF imported geometry does not… Before I go diagnose my DCC pipeline, could this be the root of the issue and why the gltf mesh does not map the video texture properly? @donmccurdy

FWIW, my OBJ was exported from C4D with the riptide plugin and the GLTF was converted via the Khronos Collada2GLTF tool, where the collada was natively exported from C4D.

Ok so long story short, baking the texture in c4d before export to collada fixed it. Notably there is also now UV attribute on the mesh’s BufferGeometry, so my uneducated answer is that you need the uv attribute on the BufferGeometry for video texture to map properly. This would explain why playing with my wrap settings didn’t work as I had originally posted.

Maybe it could be a good warning to throw if you are trying to project a video/image to a geometry without UV?

I’m thinking it was either a C4D exporter bug (using an older version that doesn’t have native gltf export), or a Collada2GLTF bug, considering the other nodes in the gltf hierarchy DID have UVs.