How to create a Points (Mesh) of TextGeometry?

Viewed 18

I am creating a TextGeometry but not able to convert in Points like a sphere or like a detailed 3d object. In the below image I have created a sphere using

  var dotGeometry = new THREE.SphereBufferGeometry(2, 100, 100);
  var dotMaterial = new THREE.PointsMaterial({ size: 1, sizeAttenuation: false });
  var dot = new THREE.Points(dotGeometry, dotMaterial);//new THREE.MeshBasicMaterial()
  scene.add(dot);

and the for text I use

  const fontloader = new THREE.FontLoader();

  fontloader.load('./models/font.json', function (font) {
    const textgeometry = new THREE.TextGeometry('Hello', {
      font: font,
      size: 1,
      height: 0.5,
      curveSegments: 12,
      bevelEnabled: false,
      bevelThickness: 10,
      bevelSize: 8,
      bevelOffset: 0,
      bevelSegments: 5
    });

    var dotMaterial = new THREE.PointsMaterial({ size: 1, sizeAttenuation: false });
    let textmesh = new THREE.Points(textgeometry, dotMaterial) //new THREE.MeshBasicMaterial({
    //   color: 0xffffff,
    //   wireframe: true
    // }));

    textmesh.geometry.center();
    scene.add(textmesh);
    // textmesh.position.set(0, 2, 0)
  });

So how to create a geometry having many points for text also, Why I am not able to use MeshBasicMaterial for Points in sphere?

This

1 Answers

What you see is actually the expected result. TextGeometry produces a geometry intended for meshes. If you use the same data for a point cloud, the result is probably not as expected since you just render each vertex as a point.

When doing this with TextGeometry, you will only see points at the front and back side of the text since points in between are not necessary for a mesh.

Consider to author the geometry in a tool like Blender instead and import it via GLTFLoader.

Related