Babylon.js

Using Javascript from SpiderBasic
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Experimental test with a camera 360°. Run it on a mobile device (smartphone, tablet, etc ....)
:arrow: http://falsam.com/sbbjs/camera360.html

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
jamirokwai
Posts: 40
Joined: Fri Sep 25, 2015 12:00 pm

Re: Babylon.js

Post by jamirokwai »

falsam wrote:
Do you think, you could add the Cardboard, and other VR-things to the Camera-functions?
Why not. This is possible.

■ This minimum code is experimental. I need testers.

Huawei P9 Android 7.0
- Android and Opera => Works
- Android and Chrome => Does not work

:arrow: Demo with your mobile : http://falsam.com/sbbjs/vrcamera.html

http://falsam.com/sbbjs/camera360.html
Both Work on iPhone 6s and embedded Safari, including gyroscope!

Thanks for the quick integration!
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Thanks for your feedback jamirokwai.

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Babylon.sbi 0.92 is done

Add

SetMeshPivot(Mesh, x.f, y.f, z.f) Change the rotation point of a mesh.
Démo - Code

MeshCollide(Mesh1, Mesh2, CallBack) Detect if a mesh is collide with an another mesh.
The callback allows to know the two meshes in collision.
Demo - Code

CameraCollide(Camera, CallBack) Detect if a camera is collide with a mesh.
The callback allows to know the mesh in contact with the camera.
Demo - Code

:arrow: Download https://github.com/falsam/BJS/archive/master.zip

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Add example 22-BeforeRender.sb

BeforeRender() is a callback feature that will run in its own loop.

Demo - Code

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
User avatar
MichaelBzdega
Posts: 6
Joined: Fri Nov 04, 2016 1:36 pm
Location: Berlin, Germany

Re: Babylon.js

Post by MichaelBzdega »

Very interesting.

Good work.
Running SpiderBasic on Windows and macOS.
User avatar
T4r4ntul4
Posts: 132
Joined: Wed May 21, 2014 1:57 pm
Location: Netherlands
Contact:

Re: Babylon.js

Post by T4r4ntul4 »

First things first, you did a wonderful job with this project, finally some 3D in spiderbasic.

But i have a few questions regarding babylon.js and loading objects:

1.: i changed the object to be loaded for my own obj file in the example: 15-canvas and gets loaded, but none of the textures are getting loaded.
I made a test object in sketchup, exported as collada, imported that in cinema 4D, exported from there to a obj file. Theres no mtl file with the export.
First question is: where did you convert your car models from? and with what software did you do the convert? (and do you have any tips on converting in general?)

2.: how do i set a color to the loaded obj file?
Then my thought was to just color the object within babylon.js but i fail there too, apparently you can make a cube, sphere, etc from babylon and color it, and that works. But not load a custom object and color it.
Question two: How can i color a loaded object?
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Effectively the file import obj is not stable. The object is imported but the texture is not assigned to an object. I will take a look.
T4r4ntul4 wrote:how do i set a color to the loaded obj file?
- Create a material without texture
- Define diffuse color
- Set material to your object

Code: Select all

;Babylon.js for SpiderBasic : Color an object 

EnableExplicit

IncludeFile "babylon/babylon.sbi"

Global Scene, Camera

Declare LoadGame()
Declare RenderGame()

UseModule BJS

InitEngine(@LoadGame())

Procedure OnLoad(Name.s, Mesh)
  Protected Material
  
  Select name
    Case "MyScene"
      
      ;Create a material without texture
      Material = CreateMaterial("Red")
      
      ;Define diffuse color
      SetMaterialColor(Material, #Diffuse, RGB(255, 0, 0))
      
      ;Set material to your object
      SetMaterial(Mesh, Material)
            
      RenderLoop(@RenderGame())
  EndSelect
EndProcedure

Procedure LoadGame()    
  Scene = CreateScene()
  
  If Scene
    ;Camera & Light
    Camera = CreateCamera("camera", 0, 0, 10, #ArcRotate)
    CameraLookAt(Camera, 0, 0, 0)  
    CreateLight("light", 0, 20, 0, 0.8)  
    
    ;The importScene function assigns a name to the scene
    ImportScene("MyScene", "data/myobj/", "suzane.obj", @OnLoad())
  EndIf
EndProcedure

Procedure RenderGame()
  RenderWorld() 
EndProcedure

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

This link https://clara.io allows modeling and exporting in babylon format. Create a free account and try

Import is possible
Scene/Asset File

FBX, Collada, OBJ/MTL, STL, JPG, PNG, blend, bvh, cfg, 3dc, txp, osgterrain, terrain, jpg, jpeg, step, stp, igs, iges, xbf, brep, csg, fcstd, oca, gcad, shp, pov, png, x, geo, tga, pbm, pgm, pnm, ppm, bw, int, inta, rgb, rgba, sgi, gdal, bmp, gif, dds, exr, ico, pcx, pfm, pict, pix, ac, lws, lwo, 3ds, tif, tiff, hdr, pdf, iv, wrl, wrz, pic, stl, obj, dae, xgl, zgl, ply, lxo, csm, irrmesh, irr, smd, vta, 3d, md5, mdl, md2, md3, pk3, mdc, nff, off, b3d, q3d, q3s, hmp, ndo, mtl, jsfbx, fbx, json, js, txt, text, md, markdown, claramats, clara, claraarchive, zip, 7z, rar, vismatzip, vismat, vrmatzip, vrmat, vrscene, vrscenezip, foyr, onshape, onshapeassembly, scmat

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
User avatar
T4r4ntul4
Posts: 132
Joined: Wed May 21, 2014 1:57 pm
Location: Netherlands
Contact:

Re: Babylon.js

Post by T4r4ntul4 »

sorry for the late reply, i was testing stuff.

My advice would be not using clara.io (because it sometimes dont work) but blender export (because you have far more options):

Explanation how to install is here:
https://doc.babylonjs.com/exporters/ins ... n_exporter

In blender you can import from sketchup with collada (*.dae)

If you export from blender you will get directory with a *.babylon extension and textures.

The babylon extension is easy to load with the following example: 15-canvas.sb (just replace ImportScene for whatever you want to load)

additional help for babylon.js blender export is here:
https://doc.babylonjs.com/exporters/blender

I hope i helped someone =)
Post Reply