-
-
Notifications
You must be signed in to change notification settings - Fork 35.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
GLTFLoader misses UV map with Points #25697
Comments
This is not necessarily an issue of the loader. The engine does in general not support texture coordinates with point clouds. |
Is there a possibility to support it in the future, and not through custom shaders? |
|
Quick conversion to vertex colors:
import { ColorUtils } from '@gltf-transform/core';
import { KHRMaterialsUnlit } from '@gltf-transform/extensions';
import { getPixels } from 'ndarray-pixels';
for (const mesh of document.getRoot().listMeshes()) {
for (const prim of mesh.listPrimitives()) {
const material = prim.getMaterial();
const texture = material.getBaseColorTexture();
const texCoord = material.getBaseColorTextureInfo().getTexCoord();
const uv = prim.getAttribute(`TEXCOORD_${texCoord}`)
const color = document.createAccessor()
.setArray(new Float32Array(uv.getCount() * 3))
.setBuffer(uv.getBuffer())
.setType('VEC3');
const pixels = await getPixels(texture.getImage(), texture.getMimeType());
const _uv = [], _color = [];
// Read color from texture, write to COLOR_0 vertex attribute.
for (let i = 0, il = uv.getCount(); i < il; i++) {
uv.getElement(i, _uv);
const x = Math.floor(_uv[0] * pixels.shape[0]);
const y = Math.floor((_uv[1]) * pixels.shape[1]);
_color[0] = pixels.get(x, y, 0) / 255;
_color[1] = pixels.get(x, y, 1) / 255;
_color[2] = pixels.get(x, y, 2) / 255;
ColorUtils.convertSRGBToLinear(_color, _color);
color.setElement(i, _color);
}
prim.setAttribute('COLOR_0', color);
uv.dispose();
}
}
// Clean up unused textures.
for (const texture of document.getRoot().listTextures()) {
texture.dispose();
}
// Switch the material to unlit.
const unlitExtension = document.createExtension(KHRMaterialsUnlit);
for (const material of document.getRoot().listMaterials()) {
material.setExtension('KHR_materials_unlit', unlitExtension.createUnlit());
}
|
I wonder if we could update the shader of |
I've hacked something in for testing. It actually does not require much changes in the points shader, see Mugen87@a138894. @mrdoob If you like I can file a PR with the feature. |
BTW: In WebGPU, this should be the default. Points always have a 1px size so using So I vote to support this change in |
I can use vertex colors, we decided on using UV's because its Vec2 instead of Vec3 and we work with millions of points so the file size can quickly get out of hand. Another benefit is quick switching of texture to instantly update colors, rather than looping over all colors individually. I would love for pointsmaterial to support map. |
That sounds good to me. I guess we should then remove We could then create a
|
@Mugen87 Would you be up for implementing |
Yes, I can do that 👍 . Regarding #25078, do you still think it's okay to start with |
Do you think it makes sense that LineBasicMaterial would also support UV map? That way all three main geometry types could handle both vertex colors and uv maps |
It does makes sense to add this to |
Not sure I follow... You mean you rather try to implement |
Yep, lines with UV mapping works in other viewers |
Yes, related issue: #17511
I would start with |
@mrdoob I have started to implement I wanted to port webgl_points_sprites to https://jsfiddle.net/vktsy0qr/1/ This is actually an issue since point clouds are frequently transformed via rotation. And since
|
Interesting... Probably better to not derive from The idea of Maybe it would be better to try to implement Or maybe a new class with a different name? |
Description
I have a simple GLTF scene with a Points mesh, that uses UV map for coloring of individual points. In both SketchFab and the microsoft 3D Viewer the uv map works correctly:
Meanwhile using the GLTFLoader the uv map is completely ignored:
I have checked and the loaded PointsMaterial contains the required map with the proper type and the actual geometry buffer contains the proper uvs.
Reproduction steps
Code
Just using the basic GLTFLoader
Live example
None
Screenshots
No response
Version
r150
Device
Desktop, Mobile
Browser
Chrome, Firefox, Edge
OS
Windows, MacOS
The text was updated successfully, but these errors were encountered: