This is just an extension of the other example.
Time to time, people ask about such interactive things. For example, an editor of prints on t-shirts
I haven’t worked with Fabric.js before, I just knew that it exists.
Today I’ve tried to combine two libraries to create a dynamic and (kind of) editable texture.
I hope, this topic will be a good start point for someone
Sorry, I do not know if I can post a question in a resources section. As shown on the example, the text can be moved freely on the 3D item. I am using this mapping for a cloth as well, I am trying to limit the mapping to a rectangle on the cloth, how is that possible? Many thanks!
Something like that?
But working with Fabric.js is out of the scope of this forum.
is there any resources like tutorial or something, or posts to move the fabricjs object directly from 3d object? currently i can select the object but i still figuring out how to move it
@naonao_naonvl and others, ZIM (JavaScript Canvas Framework) has just announced TextureActive which passes raycast x and y to ZIM to make interactive textures that are directly interactive on the material of the meshes. We added a resource link here ZIM TextureActives for Interactive Textures Cheers.
Nice, @prisoner849 - now the left hand panel can be inside three.js as a Plane - if desired. It would take about 5 minutes to do. The pseudo code (less some parameters) is:
-
Make a const panel = new TextureActive() the panel size you want - add your existing Squiggle to it with its code.
-
Then you make a const actives = new TextureActives(panel) object that controls all the TextureActive objects.
-
Use const myMesh = three.makePanel(panel, actives); and scene.add(myMesh);
The makePanel() is a shortcut for when you want a Plane geometry. It has a built in curve parameter too which is pretty nice. The ZIM gets hidden in behind - but you can toggle to it with the T key (optional). See ZIM 015 - TextureActive Interface - Code Creativity as an example. Although, probably should continue this conversation over on the ZIM post. But good to hear from you again!