The problem of model texture sampling

https://playground.babylonjs.com/#2EBLP5

Now with this method we are going to have to do a couple of rtt passes and grab different states of the shader.

The benefit of having it as a custom shader, is we can have a uniform in the main that we toggle when certain rtt renderstates are done and have our output be what ever we want.

So for example we can control it to be first the color pass of the front faces, second the color pass of the back faces, third the front face wireframes only, and last the backface wireframes.

We could then add and ramp the colors any way needed, pass the wireframes to a glow pass etc.

The sky’s the limit as long as we have barycentric coordinates on our mesh.

Praise to our ancestors: Barycentric position in shader always zero - Questions & Answers - HTML5 Game Devs Forum

https://playground.babylonjs.com/#2EBLP5#1

here is a fix to the mixing


I always thought it was a bad way to test with a ball, because most of the models used in the scene are stereoscopic, and it was a bad way to test with a ball, so I’ll switch to a box and see the difference

https://playground.babylonjs.com/#2EBLP5#2

here you go then.

The way I think about it is, normally, a cube is supposed to draw a whole face, by vertices, not by indexes, and triangles don’t have to be drawn
I guess the model is first drawn with wireframe and then pasted with transparent map


https://playground.babylonjs.com/#2EBLP5#4
Oh, I can prolly figure something out to make them quads not triangles, but I think even in your example scene there were triangles.

I bet at the very least they do two passes, one of the front faces, and one of the back then combine them.

That way the back faces can be darker.

If I’m not mistaken I think @sebavan is the original author of the solution for the barycentric shader. Maybe he can suggest how we make them quads.

I don’t know, I can’t draw it by vertices, the model is loaded, I don’t know what the vertex loading order is, right

maybe its already barycentric?

Let me see what happens when I drop it in on your scene.

UPDATE
I understand now, we do need to establish a vertices order and get them organized in the correct way.

  • This is the vertex of one of these models

https://www.babylonjs-playground.com/#4AJ16M#131

Now we are getting somewhere!

https://www.babylonjs-playground.com/#4AJ16M#132

I’m not sure if your geometry is the best for this. You might need a pro retoloplogist to clean up the geometry. They are pretty simple buildings so I bet you could handle it with a little patience in your favorite CAD program.

http://pryme8.com/low-poly-retopo-buildings/

Look at the difference in poly counts, to achieve your effect you are going to need to do ultimate low poly like these examples. In one case I was able to get a building that was 206k polygons down to just over 3.5k and this was extremely detailed still, it was a huge skyscraper with a complex wavy roofed building as its floor complex. A little bit of hands on touch goes a long way.


This is even a little to detailed for your effect.

image
Here is one that might read well. See how its basic shapes?

They come to me looking like this:
image

  • You mean, model reconstruction

I think that’s pretty much what I mean. I don’t have to draw every face, so it looks messy and dense

Then yes you are going to have to go through a process like I just showed above. Take the last two Images I posted for example.

The model came to me at 5896106 polygons, and I was able to keep the same visual look with 9993 polygons.

If you want to do the effect you are looking to achieve you will have to clean them up like this.

sorry! i don’t understand you mean
What am I going to do now

  • Retopologize your Meshes so they are within scope.
  • Apply The Custom Shader.
  • Well look at the effect on a correct mesh.
  • Create necessary Post effects and RTT’s
  • Call it a Day

  • This is the skeleton on the website. The lines are too dense

That’s because it’s crazy dense topology.

https://www.babylonjs-playground.com/#07IG98#2


this is kinda cool actually.