I have a model in Blender 2.93. I am exporting it to JSON using landon I am then importing the JSON into a WebGL rendering layer and feeding directly to shaders
The JSON UV export is an array of floats between 0 and 1
The shaders look like:
vert:
precision mediump float;
attribute vec3 position;
uniform mat4 model, view, projection;
attribute vec2 uvs;
varying vec2 vUv;
void main() {
vUv = uvs;
gl_Position = projection * view * model * vec4(position, 1);
}
frag:
precision mediump float;
varying vec2 vUv;
uniform sampler2D tex;
void main() {
gl_FragColor = texture2D(tex,vUv);
}
The model in blender looks like:
The model imported in the engine looks like:
I need ideas for next steps to debug the the UV issue with the texture. The texture seems to load okay but the UVS are off. Is there some conversion step from blender I'm over looking?
Update #1:
per @DMGregory in the comments updating the vertex shader to the gl_Position = vec4(uvs.xy * 2.0 - 1.0, 0.0, 1.0)
The engine UVS looks like the following:
We can compare this to the UV Mapping from blender:
Update #2 Model loading:
I am using the regl webgl frame work to load the model data. The UVS are in a flat 1D JSON Array and get bound to the shaders as an regl attribute
Here is example JSON of the model: https://gist.github.com/kevzettler/648cb509d8f4f5a383696449eced96a2
vec4(uvs.xy * 2.0 - 1.0, 0.0, 1.0)
as your vertex position, to visualize the UV unwrap as seen by your importer? It may also help to show us your model loading function so we can see how you're interpreting the UVs. \$\endgroup\$position
,normal
, anduvs
, based on the post at gamedev.stackexchange.com/questions/19625/… I suspect I need to massage the UVs so that they are arranged in an order that corresponds with the vertice position index. Does this make sense? \$\endgroup\$