Babylon.js October Challenge - We'll build a maze!

[jerome]

Quite difficult to guess with no PG and no idea about what you intend to do extacly...

 

Leads :

Your tube path must be an array of successive Vector3 defining the tube axis curve.

arc = 1 is not required

 

Maybe you would prefer to extrude a squared (or more complex/exotic) shape instead ?

[iiceman]

Something like that: http://www.babylonjs-playground.com/#URKM1

 

But I think the "twisting" is the problem, right?

[jerome]

http://www.babylonjs-playground.com/#URKM1#1

 

mmhh... the twist is quite normal, there is even a part of the algo (path3D) to twist it smoothly else there are many other problems

Actually, you expect it doesn't twist and you make rectangular turns by using a very discrete set of points to define the path although it is designed to twist by nature (to keep a right shape on sharp curves) and it is better with a more numerous numbers of points especially on curves.

 

I think you won't achieve what you expect with a single tube as is

 

Maybe I will add some day another behavior (with options parameter) to force it to follow curve angles without twisting and accepting the final shape might distorded somewhere.

[JohnK]

Ok, problem found. The MeshBuilder is missing the arc default value. I'll commit a fix, no idea when the playground will work again.

 

You can always start using the new way of creating the meshes using the mesh builder, this will solve the problem in the playground... like this - http://www.babylonjs-playground.com/#Q6CI#2

 

@Jerome Removing arc:1 in above playground results in tube disappearing so issue still exists in PG

[jerome]

it seems the _arc_ default has been (again) removed at least in the PG

 

Just PRed the fix : https://github.com/BabylonJS/Babylon.js/pull/773

[EJanuszewski]

Damn you guys are too fast and clever, maybe I should wait out on this challenge until I've improved a little more and leave this one to the pros.

[RaananW]

The fact that someone is fast or clever should not prevent you from showing your version for the challenge! Your version will be as good as anyone else :-)

 

Here, a motivational inspiration:

[MasterSplinter]

Something like that: http://www.babylonjs-playground.com/#URKM1

 

But I think the "twisting" is the problem, right?

Flip the faces and you got yourself a maze!

[Jaskar]

Damn you guys are too fast and clever, maybe I should wait out on this challenge until I've improved a little more and leave this one to the pros.

 

I'm not a pro neither. Just, check algs : this one is easy and I use it

First try to apply it.

Then, try to add cool features 

 

When you'll see your first Maze appear, you'll be happy 

[JohnK]

Damn you guys are too fast and clever, maybe I should wait out on this challenge until I've improved a little more and leave this one to the pros.

Another hobbiest here. What is great about not being a pro on this forum is the help the experts and non experts alike give.  Have created a duct mesh (as in heating duct) with a mitre at one end.  Have fitted some together to show how you can make right angled turns. Bit rough and ready but is a start http://www.babylonjs-playground.com/#11LZQ1

[EJanuszewski]

Wow that's very clean John, I think a lot of my issues are because my javascript isn't advanced; then I need to practice with more Math functions to assist with rotation of things. I've not really dabbled into the vertexdata stuff either, maybe that should be what I look into to fully understand how it works.

[JohnK]

One of the joys of BJS is you can ignore the vertex data stuff unless you are an expert or just a weird retired maths teacher like me. The duct is there if you want to use it.

[EJanuszewski]

I'd love to take up your offer on the duct but it wouldn't feel right, I've just spent an hour trying to use the ribbon and can't even get anything on the screen   Definitely out of my reach and that's just meant to be a simple parametric shape, more reading to do I think until I understand how all the shapes work.

[jerome]

I guess a duct is easily doable with a ribbon :

consider each edge of your duct as path (an array of vector3 : start/end of each edge section)

so there are 4 paths for your duct, just re-add the last one to close the ribbon et keep nice texture

 

pathArray = [edge1, edge2, edge3, edge4, edge1]

 

ribonnize it, and you've got your duct... without any twist 

[JohnK]

I'd love to take up your offer on the duct but it wouldn't feel right, I've just spent an hour trying to use the ribbon and can't even get anything on the screen   Definitely out of my reach and that's just meant to be a simple parametric shape, more reading to do I think until I understand how all the shapes work.

 

For the last challenge I quite happily used Jerome's SPS system by just copying some of the code from the playground. Everyone is happy for you to re-use any code on the playground. That's the second thing try your code out on the playground and lots of people will have a look and give you help to get what you want. That's how I learnt and am still learning.

[EJanuszewski]

My issue is I can't even seem to understand how the CreateRibbon works , like is it even any of these? I never figured it out, I don't want to say the documentation is bad, it's probably just because I'm a beginner and I imagine it makes complete sense to everyone else(it also doesn't help my JS isn't too strong), I also don't want to clog up this thread

	var ribbon = new BABYLON.Mesh.CreateRibbon("ribbon", paths, scene);	var ribbon = new BABYLON.Mesh.CreateRibbon("ribbon", [paths], scene);	var ribbon = new BABYLON.Mesh.CreateRibbon("ribbon", { pathArray: paths }, scene);

[jerome]

the pathArray is an array of arrays

each array is a succession of Vector3

 

[EDIT]

here is the tutorial I can't retrieve  in the doc site :

https://github.com/BabylonJS/Documentation/blob/master/content/tutorials/01_Play_Pen/Ribbon_Tutorial.md

 

and about parametric shapes : https://github.com/BabylonJS/Documentation/blob/master/content/tutorials/01_Play_Pen/Parametric_Shapes.md

[iiceman]

I always learn best from specific examples, so maybe that helps: http://www.babylonjs-playground.com/#UYUQQ

[EJanuszewski]

Oh yes, you guys are so damn helpful, I'm starting to understand how it works, and on my way to building a custom mesh  http://www.babylonjs-playground.com/#UYUQQ#3
 
I'm thinking of simply making a few different types of cube with missing faces essentially, which means I can actually create 'dead ends'
 
Ok I made some progress, having issues with one of my 'blocks', when I rotate I want it to rotate around the mesh instead of a corner, I've scoured the forum but not 100% sure on the correct answer, could someone point me in the right direction? I've put a little PG together http://www.babylonjs-playground.com/#UYUQQ#5 http://www.babylonjs-playground.com/#UYUQQ#4
 
I also have issues with shading on the top when I'm missing 2 side face but that's a seperate thing to worry about.

Edited October 25, 2015 by EJanuszewski

[GameMonetize]

@Jerome: can you reintroduce it in the current doc? I'm afraid we lost it during the transition

[JohnK]

@EJanuszewski well done with the progress you have made so far .  Have you had a look at the tutorials yet?  Try Camera in the search bar. Also in the playground in the top right corner there is the Custom menu click on this and have a look at collisions. I am not very good myself with cameras yet as you will see from this thread  which is a very inefficient way of moving around. The way it is done is using an arc rotate camera (must get to grips with this myself - see we are not all as proficient as you may believe)

 

By the way the link in your post to http://www.babylonjs-playground.com/#UYUQQ#4is not correct

[EJanuszewski]

@JohnK Oops, the WYSIWYG managed to join the 2 links together! I've updated those links now, my issue isn't the camera rotation, rather the rotation point of the object, I'm going to have another go at trying to rotate it correctly, this example might explain it better http://www.babylonjs-playground.com/#UYUQQ#6 so as you can see I'm rotating the 2nd box but it rotates around the corner rather than the center, what's a simple fix for this?

 

Sorry again everyone for clogging up this thread.

 

Edit: I'm making progress, probably not the cleanest code but I'm so eager I just figured to do it to the best of my limited knowledge, here's a sneak peak of what I've managed so far, probably doesn't look like a lot to anyone but I'm dead happy  http://puu.sh/kXzGA/4118de0fe3.jpg

[jerome]

@DK : about the doc

I guess it's still in the github repo but just not declared in the config file to be pushed to the doc site.

I'll check this (I'm off for a week here)

[jerome]

It seems someone did it : 

http://doc.babylonjs.com/tutorials/Ribbon_Tutorial

http://doc.babylonjs.com/tutorials/Parametric_Shapes

[GameMonetize]

Cool