Popular Content

Showing most liked content on 11/14/2017 in all areas

  1. 3 points

    Three.js or Babylon.js for room design

    Even with expensive software products or other service Premium offers, you will never meet such a fast and dedicated free answer and fix. Maybe, this is THE reason that you might consider about choosing BJS over ... anything else
  2. 3 points
    For you@max123: https://github.com/BabylonJS/Babylon.js/commit/9824853960fc2a4be97b1acb6907244c8df9f05e
  3. 2 points

    What's next?

    Hello dear community, we are about to ship 3.1 (early december). I'm really proud of what we did so far but I want more for 3.2 SO I'm wondering what could be useful for you regarding ease of access and simplicity. Please use this thread to give me any idea / feedback. I cannot guarantee that everything will be developed but I can promise that everything will be considered seriously
  4. 2 points

    Please welcome the TransformNode

    I know this was a big ask from the community so I'm glad to announce that we finally support TransformNode! They are node with position / scaling / rotation like any mesh but without all the rendering. So they are just here to add transformation to a hierarchy. Example: https://www.babylonjs-playground.com/#JT0HN4 @JohnKsorry my friend because this could require some update to the doc (even if by itself everything will keep working the same as before)
  5. 2 points

    3D scatterplot on babylonjs

    Hi. As I promised, I'm back with a new application of babylonjs. Without any presentations a 3D scatterplot https://www.smarteam3d.com/portfolio/3DScatterPlot.html And here is the playground version: https://www.babylonjs-playground.com/#E3XJMU#26 And here is a very basic example how to do your own 3D grid to draw your own scatterplot. https://playground.babylonjs.com/#AFGPGD#1 PS: It's not fully optimized, and I'm sure it can be done better, but it's a begining.
  6. 2 points

    Scaling Uploaded OBJ mesh

    A few options here: 1. I had the answer already, I just waited a second before you posted yours and then posted mine. 2. I have full control over the database, and I changed the signature of my post 3. I really AM a retired time traveler! 4. I wrote a very complex AI extension for chrome that tells me the minute there is a question i can actually answer. And if it can, it simply answers on its own. based on IBM Watson, Amazon Alexa, Siri, Cortana, and that horrible thing google has. Choose 1!
  7. 1 point
    Hello guys, I wanted to know how to use the phaser in visual studio 2017? I know you have this tutorial: https://phaser.io/tutorials/how-to-use-phaser-with-typescript Only that from 2013 until 2017 much has changed, If someone could update the tutorial, it would help a lot. Also if someone can teach you how to add syntaxes to the autocomplete, it would help. The syntaxes in auto completer are missing a lot, especially for those who are starting!!
  8. 1 point

    Mesh Position in World cooridnates

    Hi @nodejs That is because the carBody is parented to the "pivot" mesh See line 101 http://www.babylonjs-playground.com/#102TBD#57
  9. 1 point
    Ah good call, didn't realize that was a requirement with directional light. Done. I'll see if I can get a playground together to reproduce.
  10. 1 point
    Here we are: https://www.babylonjs-playground.com/#Z9MZRF#2
  11. 1 point
    mm things geting harder .. :))) thanks
  12. 1 point

    Scaling Uploaded OBJ mesh

    Raanan is always the fastest, from myexperience at least
  13. 1 point
    add(this.weapon.fire, this.weapon) should be the right context, but probably that's passing the signal's arguments into fire, where they don't match. So try it just as add(function () { this.weapon.fire(); }, this)
  14. 1 point


    This weekend i'll make demo video of my project (halfway through 50% PARTY ), I need BJS community opinion.
  15. 1 point

    Proper way to animate sprites

    tutorial for pixi https://github.com/kittykatattack/learningPixi example of animated sprite: http://pixijs.io/examples/#/basics/spritesheet.js pixi animated sprite sources: https://github.com/pixijs/pixi.js/blob/dev/src/extras/AnimatedSprite.js , its `PIXI.extras.AnimatedSprite` proposition to automatically change textures array: https://github.com/pixijs/pixi.js/pull/4433 , you can view source in "Files" tab I suggest you make your own animation class based on AnimatedSprite. Pixi vanilla animation is very limited, just because there are so many ways how to animate sprites, we just keep it simple. Try AnimatedSprite , then try to make your own. You also have to learn how pixi ticker works , there are always problems with ticking, for example you can just forget that you removeChild on sprite, but not stopped it from ticking. SUMMARY: there's no "proper way" of animating sprites. there are many formats for animations like Spine or GAF, and simple implementations that just change the texture. Its up to you to choose one or make your own.
  16. 1 point


    Well summarized! Yep, our outlaw is becoming quite worried. Doe RAY meat (fa-so-la-te-doe)! Great deer steaks.. from Arte's Point'n'Pick Diner! "Finger-lickin' point-pickin'... done right!" heh Barrel2 is causing intersectInfo from simple mouseOver. The other barrels, are not. This is because barrel2 has an actionManager. Disable it (~ 245-253 in #66 PG), and mouseOver intersect for barrel2... will quit. #67 PG disables ActionManager on b2, and reports intersectInfo to console.
  17. 1 point


    My pleasure! But I don't think you are a beginner. I think you are nearing BJS PRO. You have done many advanced things, so far. I predict you will do many more, too. Your procedural cabinet project is VERY cool. I have always dreamed-of a similar project... to produce funny-looking spacecraft and aircraft, using all BJS basic shapes. I think it will "facilitate" the invention of a new mesh "behavior", too (behaviors are a new BJS feature - do forum search). I think it will involve "mirroring" or "symmetry"... similar to mesh arrays in 3dsMax. Place ONE mesh of FOUR... in a certain position on the spacecraft, and the 3 other mesh (clones)... position themselves "appropriately"... in 3 other "symmetrical positions" on the spacecraft. I'm not sure what that is called, but it would make procedural aircraft... easier to create, I suspect. Maybe. And YOU are a "snap" pro! How handy for ME/US! Snapping is just manual-assisted procedural-ism. Or would snapping be... procedure-assisted manual-ism? All-in-all (and half'n'half), that's a topic for another hour and thread.
  18. 1 point


    @Wingnut thank you for teaching us (beginners).
  19. 1 point

    Mesh Facet Depth Sort

  20. 1 point

    3D scatterplot on babylonjs

    I've modified your sample to use a new version of the VRHelper that can be called from a Babylon GUI button: https://www.babylonjs-playground.com/#E3XJMU#29. Then I'll push my code, use the Boolean as a parameter to the VRHelper constructor will remove the default button displayed.
  21. 1 point


    You have done the homework. Well done! PARTY!!! Should We (sorry @Wingnut) dig deeper, or ask for help from sky?
  22. 1 point


    Ahh, its still bumpy. https://www.babylonjs-playground.com/#WWCK0#64 Watch console... I am reporting the pickedPoint from the first onPointerDOWN. I THINK I got it figged! Keeping doing pointer-downs, without drags, while watching console numbers. Switch back and forth between barrel1 and barrel2 (the barrels on the floor)... only doing pointerDowns on them, and watching console. Something can be discovered. StartingPoint is rotten. It has a "pick epsilon". (huh?) It needs its Y value to be nulled-out (for floor-drags). But why does pickedPoint SOMETIMES have a positive, negative, or 0 y-axis value? If you click on the FRONT edge of the mesh to start floor-dragging, you get a little negative Y. If you click on the BACK edge of mesh to start the floor-drag, you get some +Y. The Y value is dependent-upon WHERE (upon the mesh) that you click to start the dragging, and it continues through the entire drag-sequence. COOOOOOL! Highlight the text of this post... to view the above hidden line, and to learn what I have learned.
  23. 1 point
    The pick function is a member of the scene (and not of a mesh). It provides back PickingInfo (http://doc.babylonjs.com/classes/3.1/pickinginfo) object with the needed data
  24. 1 point

    Need cordova plugin

    This is the one i'm currently using in my game https://github.com/artberri/cordova-plugin-play-games-services .
  25. 1 point

    Align ArcRotate camera alpha

    Oh, this playground made my eyes a bit soar But all good! You found the problem, now here is the simple solution - http://www.babylonjs-playground.com/#XCGI1K#8 . % (math.PI*2) times the alpha (and beta), will keep the path liner, as it will never be above Math.PI*2 Hope this helped!
  26. 1 point
    Hi HoloLite, BabylonJS JavaScript file is built with es5 in mind, and is using UMD to expose the BABYLON namespace to AMD, CommonJS and Browser environments. Since the "export" keyword is not a part of the es5 specifications, it is being removed when compiling (transpiling, I know...) babylon to javascript. I will add a note for myslef to check if it is possible to combine all of those paradigms. but since we do intend to continue in-browser support, amd and commonJS, they will win the export-fight at the moment, if it's either es6 OR UMD.
  27. 1 point
    A mesh has 1 to n submeshes, which divide its vertex data to n parts. This is useful for many cases (from collision to Octree, to MultiMatrials and co). When you create a ground mesh, a mesh is being created, and inside of this mesh, a new submesh is created. You can see from the signature: constructor(public materialIndex: number, public verticesStart: number, public verticesCount: number, public indexStart: number, public indexCount: number, mesh: AbstractMesh, renderingMesh?: Mesh, createBoundingBox: boolean = true); It is receiving information (index-data) of existing vertex data, but has no internal information of its own.
  28. 1 point

    Why getBoundingInfo returns Nullable ?

    Since TypeScript strict-null checking detects that mesh._boundingInfo is Nullable, and the function returns this object, it was set as Nullable. Let me check if there are any problems removing the Nullable from this function. The object is being created when it is called, so you are right - it always returns an object. EDIT: https://github.com/BabylonJS/Babylon.js/pull/3145
  29. 1 point

    Three.js or Babylon.js for room design

    hahaha you beat me to it, @Deltakosh!
  30. 1 point


    On last PB I'm getting error Line 92:28 - myout.cloneNode is not a function, Should be myout1.cloneNode https://www.babylonjs-playground.com/#WWCK0#61
  31. 1 point
    Oh I got it thank you 😀 I am feel littel dump know that I didnt find out 😀 Again thank you very much @Deltakosh.
  32. 1 point
    I would say no - by setting the sphereMesh as the parent groundMesh of you have linked the two meshes as parent-child. Now when the parent moves/rotates the child will also move/rotate. In this case, if you move the sphere (ie: sphere.position.x += 2) then the child mesh (ground) will move with it. Since you are asking about creating ground - submesh can be used for multi materials. Here are good links to show what submeshes are: https://www.eternalcoding.com/?p=283 https://doc.babylonjs.com/features/materials (scroll down to "More Than One Material on a Mesh" for Playground samples) https://makina-corpus.com/blog/metier/2014/how-to-use-multimaterials-with-a-tiled-ground-in-babylonjs
  33. 1 point

    question about load glb files

    Thank you very mach!I have changed the babylon.js to the latest version.and it works well.
  34. 1 point

    gltf/glb issue

    Works now Thx
  35. 1 point


    Should we try some vertical dragging? Perhaps write a sister to getGroundPosition()... called getBackgroundPosition(), and then put a vertical ground behind the scene? Try dragging some mesh upon the back-ground? In theory, pickedPoint.z should be inconsistent... just like pp.y is, now. hmm. Last I checked, collisions from above or below (on Y axis)... REALLY sucked. They "acted" like a rather large mesh.ellipsoidOffset.y was set, even though none was. You can do some Y-axis colliding with the Q/E keys. My tests show that when barrel1 is lowered (Q key) onto top of barrel2, impact happens when barrel2 is at Y = 24. It should be Y = 18. (50%-of-mesh-height too high) After that, perhaps we add the third ground plane... along one side? Add getWallPosition() and check for inconsistent pickedPoint.x? GetGroundPosition(whichGround)... makes it a re-usable func for all three drag-dimensions (all three grounds/planes). Investigation fun. Likely, we can determine the anomaly with the point-picker... WITHOUT needing to create a 3-Dimension Drag'n'Drop Demo. But we don't want to finish this adventure TOO quickly. It's too much fun and learning-filled... to end quickly. https://www.babylonjs-playground.com/#WWCK0#60 For SOME reason, you need to click RUN... AGAIN... after PG loads-in. Watch how the barrel shapes change... after that re-run. Weird! Drag some barrels, everyone. All 6 should be draggable. Recently, I set the wireframe-sphere .ellipsoidMesh tokens... .isPickable = false. But, it STILL seems like the wireframe spheres are allowing picking, sometimes. When it happens, the sphere sort-of jiggles-around inside the barrel, but generally-speaking, the drag fails. Play around... you might see a sphere attempt to allow being dragged... instead of its cylinder "host". The cylinders (barrels) should drag. The spheres simply "go along for the ride". On the walls... collisions from above happen 50% too high. Collisions from below happen 50% too high, too. I think that is a bug in collider processing... something to do with boundingBox measuring, I suspect. I'll find it, someday, maybe. Perhaps superhero @RaananW (or anyone else) will have some advice about where I should examine code. He has done some serious work with colliders, esp involving webworker forking. Look how solid (good) those picked point numbers in the last read-out line... look (when dragging anything). Symptom has disappeared! What the hell? Our outlaw is more elusive than we first thought, eh?
  36. 1 point
    Hello, the only way would be via physics engine The MeshImpostor is certainly the way to go (http://doc.babylonjs.com/how_to/using_the_physics_engine)
  37. 1 point

    Please welcome the TransformNode

    OK no worries All good.
  38. 1 point
    Yes, to replicate it in Blender you would select the end bone, add the IK constraint and then select a chain length of 2.
  39. 1 point
    Hello this is a more general web based question. You cannot directly serve your content from the file system because of security constraints You have to use a local webserver (like IIS express or Apache)
  40. 1 point
    So far the code you've posted is really weird. Did you look at https://github.com/kittykatattack/learningPixi ? I dont know why do you need CreateSprite2D in first place, the supposed way for you is to load all textures through loader, then create stage when loader finishes everything. In stage there can be many sprites with same texture,you can take textures either using "loader.resources[name].texture" either using ""Texture.fromImage" , also there are shortcuts like "Sprite.fromImage". There's no sense in creating sprite just after one texture load. Also CreateSprite2D looks just like "Sprite.fromImage" .
  41. 1 point

    Slow performance on mobile

    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimum-scale=1, width=device-width, height=device-height"> <meta name="apple-mobile-web-app-capable" content="yes"> Also make sure that you've enabled autoResize in renderer renderer = new PIXI.WebGLRenderer(window.innerWidth, window.innerHeight, { resolution: window.devicePixelRatio, autoResize: true)); That thing changes canvas CSS, of course you can do it manually, just check that in CSS width and height are innerWidth and innerHeight respectively. Remember that "renderer.screen" and all pixi elements are in CSS pixels. - use it. "renderer.view" (Canvas) and "renderer.width" are real pixels - dont use it. As a result, with pixelRatio=2, innerWidth=640, innerHeight=480, CSS pixels must be 640x480, while real 1280x960. Check everything one more time
  42. 1 point
    For TypeScript alone - you are right. But I would always recommend using something like webpack, due to the many features it brings. I will add a note to self so I will remember to update the doc to reflect that.
  43. 1 point

    Three.js or Babylon.js for room design

    I'm convinced it is not possible to satisfy everyone. But I assure you we are trying hard
  44. 1 point

    question about load glb files

    Hi @feilong, welcome to the forum Have you tried using the latest versions of both babylon and the gltf loader? I think you are using the latest GLTF loader, but not the latest babylon, which has a different API (the AddToMesh function was added in 3.1)
  45. 1 point

    Three.js or Babylon.js for room design

    If you could pass the function your own pickingInfo object then it could pass that to a new mesh.intersectsToRef and eliminate the creation of PickingInfo here: https://github.com/BabylonJS/Babylon.js/blob/master/src/Mesh/babylon.abstractMesh.ts#L1817 Like I said though, it might not be worth the trouble.
  46. 1 point
    Hey guys, I've added a bunch new images on this page: TXR - WOOD http://soundimage.org/txr-wood/ As always, feel free to edit / mash / use parts / combine with other things / etc. as needed. Enjoy!
  47. 1 point
    Hey @lagauche, To give you a quick answer, yes you should use the reflection probes like this: https://www.babylonjs.com/demos/refprobe/ (type F12 to see the code example)
  48. 1 point

    BabylonJS Toolkit: Space Shooter Demo

    Those are not really scripts intended to be part of toolkit... that just me farting around with using the the Character Controller (which is apart of toolkit). Thats the code you would create yourself to handle your character... My First TestPlayer controller was just me trying to mess around with basic movement and using the built in BabylonJS Follow Camera... Really simple, not really a production ready type class/component... But here you are: TestPlayer.cs TestPlayer.ts My next version is me playing around with my own camera rigging... Using mesh as a camera Holder with pivot child... that way I can simply move the main camera holder with player and rotate the pivot for LOOK AND TURN... Give a better ThirdPerson Camera Feel ... Especially when not moving... then can rotate the camera all around for LOOKING... when start moving... Snaps to moving direction, then rotate control the turn... Again these are just me playing around, but here you go: StrafePlayerController.cs StrafePlayerController.ts Have at it
  49. 1 point

    Pixi.js Showcase

    Wow, you guys really like to kill. I like the name crazypanda. Maybe I should change my nickname to it.
  50. 1 point

    Simple glLTF bone example

    @bghgary thank you for the response, yes I know all this examples, maybe my scenario is too far OFF from the glTF-reality, I'd like to bend a single mesh (with weighted vertices) only. In most of the examples I've seen so far the bones are connecting different meshes with full weight I think (even RiggedSimple.gltf seems to be using several meshes) Let me tell what I found out so far: Mesh1 (all vertices full weighted) ---bone--> Mesh2 (all vertices full weighted) : OK works. (blender glTF-exporter -> BJS-Sandbox) Mesh1 (from some vertices with no weight) --bone--> Mesh1(to other vertices full weighted) : NOT OK, vertices which are NOT full weighted are dropped. (blender glTF-exporter -> BJS-Sandbox) Also there is a difference between BJS-Sandbox and threejsviewer (https://gltf-viewer.donmccurdy.com/), which doesn't drop vertices bot also doesn't bend. Conclusion: it seems in glTF weighted skinning is NOT supported, but maybe I'm wrong??? A functional blender-file would be very hepful if I'm wrong. Cheers