I am encountering an issue where the polygon is not being displayed when using InstancedBufferGeometry, even though it is shown when using BufferGeometry.
Can anyone help me understand why the code below is not functioning as expected?
Please provide guidance on how to resolve this issue.
const createGeometry = () => {
// const geometry = new THREE.BufferGeometry();
const geometry = new THREE.InstancedBufferGeometry();
const positions = new THREE.BufferAttribute(new Float32Array(4 * 3), 3);
const uvs = new THREE.BufferAttribute(new Float32Array(4 * 2), 2);
positions.setXYZ(0, -0.5, 0.5, 1.0);
positions.setXYZ(1, 0.5, 0.5, 1.0);
positions.setXYZ(2, -0.5, -0.5, 1.0);
positions.setXYZ(3, 0.5, -0.5, 1.0);
uvs.setXYZ(0, 0.0, 0.0);
uvs.setXYZ(1, 1.0, 0.0);
uvs.setXYZ(2, 0.0, 1.0);
uvs.setXYZ(3, 1.0, 1.0);
geometry.setAttribute("position", positions);
geometry.setAttribute("uv", uvs);
geometry.setIndex(
new THREE.BufferAttribute(new Uint16Array([0, 2, 1, 2, 3, 1]), 1)
);
return geometry;
};
The issue arises when trying to display the polygon with BufferGeometry.