Is it possible to sketch basic 2D shapes onto 3D models?

Question

Is it possible to sketch basic 2D shapes onto 3D models?

Is the technique called projective texture mapping? Are there any existing library methods that can be used to project basic 2D shapes, such as lines, onto a texture?

I found an example in threejs that seems similar to what I'm looking for. I attempted to substitute the decal texture (decalMaterial) with

THREE.LineBasicMaterial

However, instead of lines, I ended up with squares.

javascript three.js

Answer 1

Answer №1

Adding a line to a 3D texture presents an interesting challenge. Are you looking to create a decal on your model or actually paint onto the texture? There are alternative methods for applying decals that may be more suitable, but let's explore painting onto the texture. While I have experience with Unity in this aspect, WebGL presents its own set of limitations which I am not as familiar with. The process involves using a program similar to Substance Painter or ZBrush that allows you to paint directly onto 3D models. It is advisable to approach this non-destructively at runtime by working on a separate render texture and then combining it with the final model texture for rendering.

To achieve this, you must first render your model into texture space by outputting the UV coordinates of the model in your vertex shader.

Having recently focused on hlsl and Cg coding, my knowledge of glsl is somewhat outdated. Consider the following code snippet as pseudocode:

//Vertex Shader
in vec4 position;
in vec2 uv;

out vec4 fworldPos;
out vec2 fuv;
uniform mat4 transform;

void main()
{
   gl_Position = vec4(uv.x*2.0-1.0, uv.y*2.0-1.0, 0.0, 1.0);
   fuv = uv;
   fworldPos = transform * position;
}

In the pixel shader, implement collision detection with your brush to determine if the world position falls within the brush area. In a recent project, we utilized raycasts for the brush to follow the model surface seamlessly. This method results in an initial rough brush stroke, requiring fine-tuning parameters such as falloff strength and radius to achieve desired effects - similar to settings found in traditional 3D painting software.

You can use various shapes like planes, boxes, spheres, and lines for painting. The key is to check if the world position aligns with the brush shape. Different shaders will be necessary depending on the type of brush being used.

Answer 2

Adding a line to a 3D texture presents an interesting challenge. Are you looking to create a decal on your model or actually paint onto the texture? There are alternative methods for applying decals that may be more suitable, but let's explore painting onto the texture. While I have experience with Unity in this aspect, WebGL presents its own set of limitations which I am not as familiar with. The process involves using a program similar to Substance Painter or ZBrush that allows you to paint directly onto 3D models. It is advisable to approach this non-destructively at runtime by working on a separate render texture and then combining it with the final model texture for rendering.

To achieve this, you must first render your model into texture space by outputting the UV coordinates of the model in your vertex shader.

Having recently focused on hlsl and Cg coding, my knowledge of glsl is somewhat outdated. Consider the following code snippet as pseudocode:

//Vertex Shader
in vec4 position;
in vec2 uv;

out vec4 fworldPos;
out vec2 fuv;
uniform mat4 transform;

void main()
{
   gl_Position = vec4(uv.x*2.0-1.0, uv.y*2.0-1.0, 0.0, 1.0);
   fuv = uv;
   fworldPos = transform * position;
}

In the pixel shader, implement collision detection with your brush to determine if the world position falls within the brush area. In a recent project, we utilized raycasts for the brush to follow the model surface seamlessly. This method results in an initial rough brush stroke, requiring fine-tuning parameters such as falloff strength and radius to achieve desired effects - similar to settings found in traditional 3D painting software.

You can use various shapes like planes, boxes, spheres, and lines for painting. The key is to check if the world position aligns with the brush shape. Different shaders will be necessary depending on the type of brush being used.

Is it possible to sketch basic 2D shapes onto 3D models?

Answer №1

Similar questions

req.next does not exist as a function [END]

Changing the format of a numerical value to include commas for every 1000 increment

Best method for extracting object values from an array in Javascript using loops?

Is there a way to initiate the server only after webpack has finished bundling all of the bundles

The processing-js library threw a Reference Error indicating that the Navigator could not be found

Setting the selected option of a select form element dynamically in Vue 3

How can I effectively monitor and track modifications to a document's properties in MongoDB?

AngularJS constants are values that can be accessed and

The functionality of a generated button has been compromised

Designing an interactive region using HTML, CSS, and JavaScript

Adjusting the placement in Draw2D

Difficulty with formatting decimal points in JavaScript

What is the correct way to incorporate scrollIntoView() using jQuery?

Arranging a collection of objects (Displaying information in a random sequence)

BOOTSTRAP: changing the layout of panels in various sizes for mobile devices

The setAttribute method does not function with getElementByClass()

Symfony2 compresses CSS and JS files to improve performance

The 'propTypes' property is not found on the 'typeof TextInput' type declaration

Is it possible to deselect a checkbox in a Datagrid Material-ui by clicking a button?

Having trouble altering the error response code in feathers.js