i want a glob with points particle like in this website website
but what i have is this My code
const particles = [];
const particleGeometry = new THREE.BufferGeometry();
const pointMaterial = new THREE.PointsMaterial({ color: 0xffffff, size: 0.001 });
let model;
loader.load('/earth.glb', (gltf) => {
model = gltf.scene;
model.scale.set(0.7, 0.7, 0.7);
model.position.set(0, -0.1, -1);
gltf.scene.traverse((obj) => {
if (obj.isMesh) {
const geometry = obj.geometry.clone();
const positions = geometry.attributes.position.array;
for (let i = 0; i < positions.length; i += 3) {
const x = positions[i];
const y = positions[i + 1];
const z = positions[i + 2];
const particle = new THREE.Vector3(x, y, z);
particles.push(particle);
}
}
});
const particlePositions = new Float32Array(particles.length * 3);
for (let i = 0; i < particles.length; i++) {
particlePositions[i * 3] = particles[i].x;
particlePositions[i * 3 + 1] = particles[i].y;
particlePositions[i * 3 + 2] = particles[i].z;
}
particleGeometry.setAttribute('position', new THREE.BufferAttribute(particlePositions, 3));
const particleSystem = new THREE.Points(particleGeometry, pointMaterial);
particleSystem.scale.set(0.4, 0.4, 0.4)
scene.add(particleSystem);
});