Questions about PointsMaterial

Questions
,
1

In version 0.162.0, I set the map property to the PointsMaterial material, but there was an issue with rendering. The change was not the shape of a single point, but rather the overall shape rendering style. When I switched to rendering under version 0.137.5, it was the result I wanted. Is it because the new version has a new writing style?Here are some comparison pictures I have provided
no map
image

what I wanted

image
image610×570 59.5 KB

my code

const pointsMaterial = new THREE.PointsMaterial();
pointsMaterial.size = 0.1;
pointsMaterial.color.set(0xfff000);
// pointsMaterial.sizeAttenuation = false;

const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("./textures/particles/1.png", event.onLoad);
pointsMaterial.map = texture;

const points = new THREE.Points(sphereGeometry, pointsMaterial);
scene.add(points);

image
This is not the rendering result I wanted. After switching versions, it can render normally
My texture image looks like this
image

So how should I code in the new version to achieve the rendering effect I want?

1 Like
2

Try Material.transparent

3

Try removing the UV coordinates of your geometry:

sphereGeometry.deleteAttribute( 'uv' );
3 Likes
4

oh~thank you!！！！！May I ask why? I am a beginner~Do I have to code like this in the new version, or do I have any errors in my code?

1 Like
5

Three.js r137 was, like, more than 2 years ago. Things evolve. If you manually create the geometry for THREE.Points, it will be OK. If you reuse the vertices from another geometry, it may contain UVs … and you have to remove them.

1 Like
6

ok, I understand. Thank you for your answer :smiling_face: