Jump to content

Oval code?


avrudoi
 Share

Recommended Posts

How error?

<script type="text/javascript">    // Get the canvas element from our HTML below    var canvas = document.getElementById("renderCanvas");    // Load BABYLON 3D engine    var engine = new BABYLON.Engine(canvas, true);    var scene = new BABYLON.Scene(engine);    var sphere = BABYLON.Mesh.CreateSphere("sphere", 32, 1, scene);    sphere.scaling = new BABYLON.Vector3(1, 2, 1);    // Attach the camera to the scene    scene.activeCamera.attachControl(canvas);    // Once the scene is loaded, just register a render loop to render it    engine.runRenderLoop(function () {        scene.render();    });</script>
Link to comment
Share on other sites

You don't have any camera in your scene, so scene.activeCamera won't work.

 

Try this : 

<script type="text/javascript">    // Get the canvas element from our HTML below    var canvas = document.getElementById("renderCanvas");    // Load BABYLON 3D engine    var engine = new BABYLON.Engine(canvas, true);    var scene = new BABYLON.Scene(engine);    var camera = new BABYLON.FreeCamera("cam", new BABYLON.Vector3(0,0,-10), scene);    var sphere = BABYLON.Mesh.CreateSphere("sphere", 32, 1, scene);    sphere.scaling = new BABYLON.Vector3(1, 2, 1);    // Attach the camera to the scene    scene.activeCamera.attachControl(canvas);    // Once the scene is loaded, just register a render loop to render it    engine.runRenderLoop(function () {        scene.render();    });</script> 

And "How error" is not VERY easy to understand. Can you please try to be more understandable ?

Link to comment
Share on other sites

Ok, maybe you are looking for Constructive Solid Geometry (CSG)... also called "boolean geometry" sometimes.  Thanks to Feldspar and Deltakosh, BabylonJS has CSG.  It is quite new, a little slow, and there are not many tutorials, but you can read much about it on the web.

 

I made you a little demo and a zip file.

 

This is animated.  CSG is CPU-complicated.  Therefore the frame rate is slow.  After you experiment with this code for a few weeks, you will learn all about it, and de-animate it, and become a boolean expert.  You will also probably set the 'source' meshes (the wireframe meshes) to be invisible.  That is done with... mesh.isVisible = false or with mesh.visibility = 0.

 

Everything you need... to slice spheres and ovals... is in this demo.  It will take time to understand what is happening.  Read read read... on the web.  There are THOUSANDS of documents on the web... about boolean operations on geometry.  Experiment... much!

 

Nobody is going to GIVE YOU the code to do exactly what you want to do, because nobody KNOWS what you want to do.  But CSG is one of the easiest ways to cut-up spheres... and if you study the code carefully, and read, and experiment, CSG MIGHT do what you want.

 

Here is the ORIGINAL demo... that I modified to make YOUR demo...

 

http://www.babylonjs.com/playground/#NZPX4

 

It is also on the babylon main website... but it is easier to examine the code... at the playground.  Feldspar also talks about the CSG system... here...

 

https://github.com/CraigFeldspar/BabylonCSG  (scroll down)

 

Hopefully, now you have all the information you need.  All you need to do is learn, and then write your code and experiments.  Good luck!

Link to comment
Share on other sites

no I haven't looked Csg. I do not hope to write code using the other. Perhaps the information you showed me will help but I don't quite understand to which section apply, whether it's animation whether yet another tool. but thanks anyway.

Link to comment
Share on other sites

There are other ways to cut spheres.  One way is to do your own vertex plotting.  Here is an arrow that I once vertex plotted.  It was not very easy, but it was my second time plotting, and advanced math could have done it much more automated.  Just ignore the numbered boxes.  They can be easily removed and were used to do the "connect the dots into triangles" that must be done for the 'indices' part of plotting. 

 

Here is the code that did the plotting.  Notice that the arrow has three 12-sided circles.  One around the arrow head, and one at both ends of the arrow shaft.  Here is the code that plots the vertex positions used for one of the circles:

var alpha = 0;for (var i=0;i<12;i++) {     positions.push(headradius * Math.sin(alpha), headradius*Math.cos(alpha), 0);     alpha += .525;}

That makes a circle of vertex positions.  If you think about it, a sphere's vertices are a series of circles.  So to make a sphere, you would make a stack of circles... first small, then getting larger and larger, and then getting smaller again.  Its not easy, but you could make spheres and cut spheres... using plotting.

 

There is another way.  Take a look here... https://github.com/BabylonJS/Babylon.js/blob/master/Babylon/Mesh/babylon.mesh.vertexData.js .  Scroll down about 1/3 until you find 'VertexData.CreateSphere'.  That is the code that babylon.js uses to create the shape of its spheres.  You could copy that framework code... into YOUR code... as a standard function.

 

Once that code is inside YOUR code, you have made your OWN PERSONAL math-based sphere-plotting function... and you could start doing modifications.  One thing you would do is remove 'return vertexData;' at the bottom and instead do...

var sphere = new BABYLON.Mesh(name, scene);vertexData.applyToMesh(sphere, updatable);

That makes a 'blank mesh' and then applies the sphere vertexData SHAPE onto the blank mesh.

 

Now you have a PERSONAL sphere maker.  See the FOR loops in that code?  You could stop them before they are finished, and it would produce a partial sphere... or in other words, a cut sphere.  (also called hemi-spheres and semi-spheres).  But there is one problem with sphere-making that is stopped before completing.  They have holes.  The hemi/semi sphere is not 'capped' and if you need them capped, you will need to cap them somehow (close the big hole).

 

Maybe other webGL frameworks already have easily-callable semi/hemi sphere creation code.  Maybe not.  You will need to research it.  Maybe somebody who is reading this... will code a semi/hemi sphere function, but don't count on it.  It is not an easy thing to code.  But if YOU coded it and then donated it to the babylon.js code base, you would be a hero.  :)  It would likely take you 3-4 months depending upon your math and JS skills. 

 

It would probably take me six months, because I am pretty stupid, and there would be a high chance that I would completely fail.  :)

 

Why do SOME things have to be difficult, eh?  I agree.  WebGL is still quite new, and tools still need to be created to make things easier.  YOU might be one of the toolmakers... and become famous... as the creator of babylon.js hemi/semi sphere tool.  Take care!

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.

Guest
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.

Loading...
 Share

  • Recently Browsing   0 members

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