I create a geometry from Bezier curves, like so: function makeGeom(curves) { let threeShape = new THREE.Shape(); for (let c = 0; c < curves.length; c++) { var bez = curves[c]; threeShape.moveTo(bez.x[0], bez.y[0]); …

Yes, I understood that part, I was curious about the rest of it. Anyway, I figured out how to do different gradients on shapes, so I’ll leave a fiddle here in case somebody finds it useful. [shape_bg] [image] Edit fiddle - JSFiddle - Code Playground

Thank you, unfortunately, I don’t understand the idea behind your code, I see that it calculates UVs across the surface but why do you use quaternions and recalculate geometry points?

The part, that you need, is here: var box = new THREE.Box3().setFromObject(mesh); var size = new THREE.Vector3(); box.getSize(size); var vec3 = new THREE.Vector3(); // temp vector var attPos = mesh.geometry.attributes.position; var attUv = mesh.geometry.attributes.uv; for (let i = 0; i < attPos.cou…

How to use UVs in ShapeBufferGeometry?

Questions

prisoner849 November 13, 2020, 8:30pm 2

Hi!
Have a look at this post and whole topic: Texture on dynamically created object

1 Like

Topic		Replies	Views
BufferedGeometry UV calculation and texture assignment Questions geometry	1	740	December 5, 2019
Unwrapping a custom ShapeBufferGeometry Questions geometry , shaders , shapes , uv	4	815	June 28, 2022
Apply texture to custom shape Questions textures	9	2894	March 16, 2023
Texture on dynamically created object Questions textures , materials , geometry	13	7925	April 1, 2020
BufferGeometry compute UV Questions geometry	2	2560	September 19, 2021

How to use UVs in ShapeBufferGeometry?

Related topics