Color bleed on Multi-Object UV maps

Questions
1

Hello!

The Scenario:
I have this .obj file that I load up. It imports x-number different meshes and I have a single image I use for its UV Map.

Here is a playground I made before

When loaded up you click on the Generate Heat button and it generates random locations around the object (a jet). The code then locates the closest mesh/facet/point for each random location. It then finds the associated location on the UV Map (which is used on a dynamic texture) and paint a heat spot (several concentric circles of varying colors/alpha levels). The dynamic texture is then applied to the object… This works; however…

The Problem:
While the heat spot is centered at the correct location on the map, i get color bleed. You can see why here
heat

but it should look like this
heat - correct

The center of the heat spot is where its supposed to be on the UV map… but it bleeds over to other mesh maps areas. The result is… uncool. Heat where it doesn’t belong.

The Questions:
Is there a way to confine the color to the mesh it belongs to?
And if not, are there examples of loading an OBJ file that has a UV Map for each of its meshes? Would that be a terrible course of action?

Thank you,
Carlos

2

Hello,

Your mesh is textured with a single picture:
image

So, when you paint on it:
image

It’s your painting function that should try to stay inside triangle borders…

However, it may be easier to change the vertex color of the vertices of the triangles that are affected by the heat instead of updating the texture…

I think the picking system of Babylon.js can find the triangle in the geometry that corresponds to the clicked point. Then, from this triangle, I suppose you will have to find the adjacent triangles and do some calculations to find the heat (color) of the vertices…

2 Likes
3

Ev, I’ll take a look at that.

I also noticed a shader playground that looked kind of promising: https://www.babylonjs-playground.com/#T9VI62#3

Line 25 defines a var sresult
that appears to be a string of functions to be evaluated by:
sphere.material.Fragment_Definitions(sresult);. Is that like a direct interface to webGL?

4

Is there a way to turn off material updates for each mesh in an obj?
Like if I know which mesh needs to be updated with the dynamic material then I can turn off the others. that way even if the dynamic material is painted on, i can still control what mesh displays it.

Is that possible?

5

It’s a way to inject some code in the standard babylon material; you first create a BABYLON.CustomMaterial instance then use methods to inject code where you want in the shader:

  • Fragment_Definitions allows you to inject functions into the fragment code
  • Fragment_Before_FragColor allows you to modify the final color computed by the fragment shader
1 Like
6

You can simply replace a material by another one with mesh.material = myNewMaterial and when you are done just re-assign the old one.

1 Like