hello.
It seems that there is one texture per pixel. But what I want is to have only one texture for the entire model. How do I do it?
this is my code
const plyloader = new PLYLoader()
plyloader.load(
'./models/newmesh.ply',
function (geometry) {
geometry.computeBoundingBox();
const positionAttribute = geometry.attributes.position;
// Create a new Float32BufferAttribute to hold the UV coordinates
const uvAttribute = new THREE.BufferAttribute(new Float32Array(geometry.attributes.position.count * 2), 2);
// Calculate the UV coordinates based on the geometry's bounding box
const boundingBox = new THREE.Box3().setFromBufferAttribute( positionAttribute );
for ( let i = 0; i < positionAttribute.count; i ++ ) {
const point = new THREE.Vector3().fromBufferAttribute( positionAttribute, i );
const uv = new THREE.Vector2(
( point.x - boundingBox.min.x ) / ( boundingBox.max.x - boundingBox.min.x ),
( point.y - boundingBox.min.y ) / ( boundingBox.max.y - boundingBox.min.y ),
);
uvAttribute.setXY(i, uv.x, uv.y);
}
// Set the UV attribute of the geometry
geometry.setAttribute( 'uv', uvAttribute );
// Create a new Mesh with the geometry and a material
const tempMaterial = new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } );
const mesh = new THREE.Mesh( geometry, tempMaterial );
mesh.scale.set(0.01,0.01,0.01)
console.log(mesh)
// Add the mesh to the scene
mesh.name = "test"
scene.add( mesh );
//const object = mesh.getObjectByName( 'test' );
//Convert to NodeMaterial
// const material = MeshPhysicalNodeMaterial.fromMaterial( object.material );
// const checkerNode = checker( uv().mul( 0.1 ) );
// material.colorNode = mix( color( 0x000330 ), color( 0xffffff ), checkerNode );
// material.roughnessNode = checkerNode;
// object.material = material;
//scene.add(object)
function resetUVs( object ) {
var pos = object.geometry.getAttribute( 'position' ),
nor = object.geometry.getAttribute( 'normal' ),
uvs = object.geometry.getAttribute( 'uv' );
for( var i = 0; i< pos.count; i++ ){
var x = 0,
y = 0;
var nx = Math.abs(nor.getX(i)),
ny = Math.abs(nor.getY(i)),
nz = Math.abs(nor.getZ(i));
// if facing X
if( nx = ny && nx >= nz ){
x = pos.getZ( i );
y = pos.getY( i );
}
// if facing Y
if( ny>=nx && ny>=nz ) {
x = pos.getX( i );
y = pos.getZ( i );
}
// if facing Z
if( nz>=nx && nz>=ny ){
x = pos.getX( i );
y = pos.getY( i );
}
uvs.setXY( i, x, y );
}
}
resetUVs( mesh );
},
(xhr) => {
console.log((xhr.loaded / xhr.total) * 100 + '% loaded')
},
(error) => {
console.log(error)
}
)
refer to this url https://codepen.io/boytchev/pen/rNZxLLK
and this
And This picture is with only one texture, but spread out in the z-axis.
how can i do something?
please give me your wisdom!