Hello guys,
I need an idea that engrave the words into a geometry, and how to bend the textgeometry as round as rings . Such as we always put our name in the inner ring.
I can only put the textgeometry on a geometry.
There is an artical talk about it, but Scheme 2 isnt clear for me if it works
Thanks,
Alan
Do you want to be able to change the writing at run time? If so, probably the easiest approach is to use a bump map.
First, set up the ring geometry in a modeling program with a test texture (e.g. with the words “A promise is forever”) so the words appear in the correct location in the ring. Then at run time in your app, you can generate a new texture with different words using a canvas texture.
Actually, this is for 3D printer, therefore, texture is not good. I need engraving words on the geometry.
If you don’t need to change the text at runtime, then I think you will have an easier time building it in blender first.
Use the boolean modifer to subtract your text mesh from the ring.
Then export the model as glb/ply/stl/obj/etc from blender.
If you do need to update the words at runtime, you will probably need to use a CSG library. There are quite a few three.js CSG libraries around, although they are mostly out of date (they only work with Geometry, not BufferGeometry).
You can follow this thread for progress on building BufferGeometry based CSG libraries.
In particular, I have a port of evanw/csg.js here:
And @SebiTimeWaster has version based on jscad/csg.js here:
I think Sebi’s is faster than mine, I haven’t tested it though.
Realtime circular text engraving in threejs
Example : https://cm5lp.sse.codesandbox.io/
Beware that longer strings take longer to process
Thanks, Seanwasere, it is a wonderful example. However, currently, I am using js, not jsm. Could you please provide the source code to me? I want to convert to js project. I tried to save each js from this website but cannot run it locally.
For subtracting geometries use
For bending geometries use
Both of the repositories are ES6 modules first, but you can find CommonJS versions of the libs in the /dist/client/ folders suffixed with .cjs.js
Both libs support geometries of type THREE.Geometry and THREE.BufferGeometry
Examples of where I use these libs
Bender : https://sbcode.net/threejs/bender/
Engraving : https://sbcode.net/threejs/engraving/
CSG-gLTF : https://sbcode.net/threejs/csg-gltf/
Cool, thanks. I already made it.
However, I am subtracting an stl model and TextGeometry. The process will take different time according to different letters, Such as
B: 87.037s
C:117.707 s
O:116 s
G:121.36 s
S:222.64 s
U:45.45 s
R:37s
Others will take a shorter time.
Buy using normal geometries might faster than the stl model.
The STL will already be a THREE.BufferGeometry after it is loaded if you are using a recent version of Threejs.
You have the option to reduce the amount of curveSegments when you create your text geometry which will make it faster.
How many vertices are in your CSGs will make a significant difference to speed.
Cool, thanks. I set 22 for the curveSegments 
I changed to 2, it faster
There is another issue when I do the subtract. All the code is running at the backend, but when the geometries start subtract, nothing on the page can be manipulated.
Do you know how to fix this issue? It seems the subtract process cost all the cpu/memery/thread.
