Jump to content

Solved: Mesh Editor - Edit Ribbon Vertices?


Recommended Posts

How do you create specific Ribbon or Path shapes?

Has any one created "Mesh Editing" within Babylon? 


UPDATE: this caused a deeper dive into collisions.... a lot like falling down stairs.



@Wingnut had a good idea providing this link, http://www.babylonjs-playground.com/#1UHFAP#7

I think I'll give it a try. :) -> Adding pick points and rudimentary key commands to move a vertex in 6 directions...

Any Ideas on "Mesh Editing", or other previous vertex picking (position vertex with ui) attempts? 




Link to comment
Share on other sites

:)  Wait until you start NEEDING to manually add the UV's... to get a texture to sanely map-onto your hand-plotted pigmesh. 

Have aspirin nearby.  Consider having "comfort" nearby, both Southern and lover.

Myself and @kaitek666 went on a serious adventure... trying to texture a single little corner-piece of ribbon.  It nearly killed us.  :D

PG:  https://www.babylonjs-playground.com/#21VLCN#17

(...plus many failed versions dating back to #5 or so)  (Dontcha wish PG app had + and - buttons for touring thru #versions of this PG?)

Thread:  http://www.html5gamedevs.com/topic/29397-ribbons-ignore-texturing-instead-they-assign-a-color/

Some people can "think in UV" and maybe you are one of the lucky ones.  But, just go do some UV/texturing on that #7 "Plottery Barn" demo... just to get a feel for UV goodness.  You're gonna love it!   ;)

Vert colors are prettier and easier, eh?   heh.  yeppers.  Love that dither!  And don't forget the Air-Cooled Performance-Pointing Racing Arrow, my best hand-plot so far.  I hear that it can accurately point at stuff... that is over 10,000 km away.  ;)

@Arte and I got drag'n'drop drunk one week, and built a 3D drag'n'drop tri-grid "thing".  Tri-grids are sometimes used for modeling.  Lets say you click on a vert, it might become a red dot, indicating it is selected.  It can ALSO become a red dot... on all three grid-planes, and you can drag/drop it on any one of those planes.

Other modelers use keys... such as control-dragging or alt-dragging... to constrain drag axes.  Why would anyone want to create another modeler?  *scratch scratch*  Masochist?  ;)

Link to comment
Share on other sites

@Wingnut that tri-grid is fun... and it helps.

This CHALLENGE: is to customize a ribbon (by clicking the number box) then using keypad events, to reshape it in babylon...

-> then publish vertexData out to console.log, and re-seed into ribbon builder for final refresh.

Why? Terrain builder.

Why not blender? It would be difficult to shape in relation to other objects that are Babylon based.

And custom impostors...., stay with me.

It would be all or none Blender... and for terrain...  editable ribbon format (around other objects) would be awesome. :)

So I am going to try out the Action manager idea you had over in this other thread(


And we will see what happens... :) 

Link to comment
Share on other sites

Ahh, I understand, I think.  Only portions of the terrain... will have physics impostors.  But they must match terrain contour with non-physics active areas.

Would a mountain be a good example?  You want rocks to occasionally tumble off the mountain with physics.  But there is no reason to have physics active on the adjacent prairie lands. So... make a volcano-contoured little piece of heightMap... and only IT is physics-active.

Still, it seems more of a "scissors task" than a modeling task.  If you get a great heightMap image of a mountain, hi-rez, and if the rez is real high on the terrain grid... you should get a great mountain, without modeling.

The mountain section could be very hi rez subdivs, yet it is "sewn-into" a less-subdivs patchwork terrain.  THAT would be pretty cool.  Still, it's just piecing-together multiple heightMap/displaceMap areas... pretty easy (except for texture scaling, and averaging the lighting normals across the seams, to make them invisible.)

But something tells me that you are going farther.  :)  You are going to contour terrain... "around" other mesh.  You want to test the "seams" between terrain impostors and mesh impostors.  HeightMap terrain impostor ramp, up onto a box impostor, and back down the heightMapImpostor down-ramp.  :)  You are going to embed mesh into the terrain contours, aincha? 

Yep, I think so.  You're on a mission from hell.  I'll watch and giggle... but it IS pretty interesting.

Blender, the modeller... is BORING... compared to blender... the demented idea happening inside-of aFalcon's brain.  :)

There's a couple of heightMap elevation editors nearby, somewhere.  I've seen 'em... for BJS.  I know Jerome has one... as part of his Artillery Duel thing.

Wingy just yackin' aimlessly.  *shrug*  Blizzardy outside, here.  brrrr.

Link to comment
Share on other sites

Correct. And I hear ya...  normals going to flip around ... thanks for the heads up. Maybe one could detect the normals that point down angle (-y) and say... flip?

Yes, fits well with 1) heightMapEditor and 2) MipMap stuff.... attaching edit nodes to ribbon now. :) 

And out of likes (again)...


Link to comment
Share on other sites

With a ribbon (positions) loop...


15,000 vertices, (quad-state) clickable....

First sign of flame.... camera getting wacky:

Related image

Actually not too bad... there was a boot burn, (for the super-size-string) but landscape data in JS module like! : )

Because, loading landscapes asynchronously... : )

DESCRIPTION: sensitivity on camera zoom becomes greater (jumping sizes)... after 15,000 spheres. ok. Understandable...

TEST: So, 15,000 cubes? Why not...




Link to comment
Share on other sites



The ribbon vertex is modified...


And normal... seems ok... after recalculation.

Behavior: quad-state nodes [x,y,z,none], is red, green, blue, grey, and increment/decrement keys "i" or "k" on everything selected!

Thx @adam (I think) for this [https://www.babylonjs-playground.com/#1UZIZC#33]  and @Wingnut for ActionManager picker suggestion...

Next Steps: export & import... arrays[15,000]. idk, :), will it crash the copy-buffer!?! Nope was ok.

Tutorial and code dump soon... (MeshEditor ~ on the list).

Link to comment
Share on other sites

Rehydration of the (edited) Ribbon was the hardest part...


... import has to match the ribbon-dimensions.

And interesting side effect of rounding numbers on import!

Where have we seen that look before....? (stumbled into that!)

Here was the export:


...into a .js file with a gigantic single-line-string. Then split(','), parseInt(rounding), etc...

Fun! and SOLVED.

Link to comment
Share on other sites

  • RaananW changed the title to Mesh Editor - Edit Ribbon Vertices?

IMPORT-OPTIMIZATION: after copying edited string or ribbon points, instead of splitting into an array, and then converting back to integers. There is a subtle FIX: 

Simply change the "" quotes to brackets [] in the .js file ...

var pathData = "1,2,3,4,...";

var pathData = [1,2,3,4,...];

And the var pathData is converted from giant-string to giant integer array...



Link to comment
Share on other sites

Thx  for that math Jerome... yeah... I see. 


UPDATE: There was a problem with the impostor....


PROBLEM: stretching y ( above) seems to create a gap in the collisions at the base of the cone

INSIGHT: User Error. Around Ray-Based Fake-Physics:

 -  neither the mesh nor the ground have collisions enabled...

  - Instead there are two Rays casting depth and orientation tilt.

  - so the missing collisions were - a lack of resisting force!

SOLUTION: detected when the rays pass a wall... then 

moveY can be bumped on each frame, so that the collision is climbed... OR,

collision can be bumped back to last gravity point.


Finally afalcon finds: this._collideWithWorld()




Link to comment
Share on other sites

UPDATE: Successfully editing lines....


similar, and slightly different:

    track = BABYLON.MeshBuilder.CreateLines('track', {points: editPoints, updatable:true}, scene);
    track.color = BABYLON.Color3.Blue();

    track.updateVerticesData(BABYLON.VertexBuffer.PositionKind, positions, false, true);

     Next: loop those 400 points into an Infinity Symbol.... or figure out maths... Bernoulli!

Link to comment
Share on other sites

If you create an updatable Lines mesh, you don't need to use updateVerticesData() then. You can re-call CreateLines() by passing it the object to update with the parameter instance

  track = BABYLON.MeshBuilder.CreateLines('track', {points: editPoints, updatable:true}, scene);
  track.color = BABYLON.Color3.Blue(); 

  // here, update the coordinates in the editPoints array
  // then call again CreateLines() with the parameter "instance"
  BABYLON.MeshBuilder.CreateLines(null, {points: editPoints, updatable:true, instance: track});


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...