• Content Count

  • Joined

  • Last visited

Everything posted by Topper

  1. Hi, the angels of the diagonal braces are correct and so are the braces lengths (they are still not in the middle though). Believe me. Math is not my pain. They are supposed to meet the inner side holes of the uprights and future screws. Here´s my pain: I position seven diagonal braces along Y. I make BJS return the centers (Line 298) of each: var meshLocalCenter = braceD.getBoundingInfo(); var meshWorldCenter = braceD.getBoundingInfo().boundingBox.centerWorld; For every single diagonal brace I get the same values although their positions (at least in Y) are definitely different: center: {X: 0 Y:-6.448263332091828 Z:-0.15} centerWorld: {X: 0 Y:-6.448263332091828 Z:-0.15} How´s that? Check it yourself. That´s what I´m not getting. BR, Markus
  2. @ brianzinn Thanks, but I´m not getting it. I know that order matters, but when i move (position) my braces, their "reference points" are still (0, 0, 0). Do I my mean something else by "moving a mesh"? BR, Markus
  3. Hi JohnK, thanks for your reply. I went throug your PG and I´ve a question on it: When I spawn a mesh like a box or a sphere it will always be in (0, 0, 0). But when i create a more complex mesh based on an extruded 2D-shape (bunch of vector2() in an array) the mesh´s reference point is still the 2D´s reference point and not the new mesh´s (3D) CoG. Since my workflow is like this: - make 2D shape - extrude 2D shape to 3D shape - perform first rotation (PI / 2 in z (world axes) - perform second rotation (calculated angle in y (world axis)) - move mesh in z (world axes) - move mesh in y (world axes) I kept sticking with the idea that it may be easier to calculate arbitrary points as "rotation axes" then using anything else. Here you can find the example I´ve been working on: My challenge is to position the diagonal braces in between the two blue uprights. I already calculated the "rotation axes" for every singe diagonal brace (green spheres), but I keep failing in using these points as "rotation axes" My plan was to do this "pivot point thing", since a mesh's CoG is not in (0, 0, 0) when I extrude a 2D shape. Would it help to clone my mesh to get one with its CoG in (0, 0, 0)? Thanks in advance guys, Markus
  4. Hi folks, I´ve been going through a lot of PGs and the BJS docu as well to figure out the best (most easy way) to place meshes in a scene. I still don´t understand why it´s necessary to distinguish between world space an local space, and I´ve seen a lot of posts of people struggling with the same topic. What is the easiest (and most elegant) way to position and rotate a created mesh based on one coord system (probably world) always based on a mesh´s CoG? I just want to spend a Vector3(x, y, z) and perform some rotations after, always based on a mesh´s CoG. I studied this PG, but I don´t understand why I have to do all the calcs (transformations) by myself: Is there some standard functionality i didn´t come across yet? BR, Markus
  5. Thanks JohnK, this works well. BR, Markus
  6. Ok, I still Need some help, I´m using a for loop to create multiple cylinders along the main mesh´s Y-axis to cut holes using CSG. For some reasing it only cuts out the hole the last cylinder produces. I´m not sure if i´m using the wrong order of my code lines in the for loop. Thanks, Markus
  7. Thanks folks, CSG is exactly what I need. It´s pretty straight forward, though. Unfortunately I didn´t find enough time yesterday evening to code the JS-functions to cut the needed holes over the whole mesh length. But CSG already became my new friend. ;-)
  8. I already came across this and found a PG about making holes into a balling ball. Gonna have a look into this right away. thanks, Deltakosh
  9. Hi everyone, I´m trying to figure out the best way to put holes in an extruded shape. What I want to get achieved is the upright of a pallet rack with hole patterns on three different sides based on user input. I want to keep effort and complexity as little as possible. I already tried two different approaches: 1) create shape, add holes, extrude 2) create shape, extrude, ??? I already went through the "house sample" in the PG, but the workflow there is kinda different: I want to define the holes (or their coordinates) after having extruded my shape. Here´s the result of my two tries. Is there a way to cut holes into an extruded shape by vector3 ccordinates? BR, Markus
  10. @ Pryme8 That´s awesome. Thanks a lot, man, I really appreciate it. @ Deltakosh Sounds about right. Damn, I should definitely stop coding after 16 hour. But for some reason BJS is highly addictive to me. BR, Markus
  11. High, no idea why BJS struggles with this code: It fails when I want to push coordinates in my array in this very line: myPoints.push(new BABYLON.Vector3(shortLength, currentHeight, 1)); Here´s the code of my function; doesn't even start in PG: this.createMeshRuler = function(){ var rulerHeight = 5.000; var rulerWidth = 0.500; var sourcePlane = new BABYLON.Plane(0, 0, 0, 0); sourcePlane.normalize(); var meshRuler = BABYLON.MeshBuilder.CreatePlane("meshRuler", {height:rulerHeight, width: rulerWidth, sourcePlane: sourcePlane, sideOrientation: BABYLON.Mesh.DOUBLESIDE}, this.scene); meshRuler.position = new BABYLON.Vector3(0.5 * rulerWidth, 0.5 * rulerHeight, 0); var rulerMaterial = new BABYLON.StandardMaterial("myMaterial", this.scene); rulerMaterial.emissiveColor = new BABYLON.Color3(1, 1, 0); meshRuler.material = rulerMaterial; // Striche einfügen var restHoehe = rulerHeight; // verbleibende Höhe bis OK Ruler var currentHeight = 0; // aktuelle Höhe beim Aufbauen des Rulers var step = 0.200; // Schrittweite var stepCounter = 0; // Schrittzähler (Schleifendurchläufe) var shortLength = 0.2000; var longLength = 0.3500; Ende: while (restHoehe > 0) { currentHeight = restHoehe; // kurzen Strich if (stepCounter < 5) { var myPoints = []; myPoints.push(new BABYLON.Vector3(0, 0, 0)); myPoints.push(new BABYLON.Vector3(shortLength, currentHeight, 1)); var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myPoints, updatable: true}, this.scene); lines.color = new BABYLON.Color3(1, 0, 0); stepCounter = stepCounter + 1; currentHeight = currentHeight + step; // langer Strich }else if (stepCounter === 5) { var myPoints = []; myPoints.push(new BABYLON.Vector3(0, 0, 0)); myPoints.push(new BABYLON.Vector3(longLength, currentHeight, 1)); var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myPoints, updatable: true}, this.scene); lines.color = new BABYLON.Color3(1, 0, 0); stepCounter = 0; currentHeight = currentHeight + step; // Error }else{ /// Alert } } }; All browsers start to freeze; more or less. Any suggestions, what´s happening? BR, Markus
  12. works perfect: So glad that I decided to use BJS instead of anything else.
  13. Thanks a lot, man. That´s exactly the trick I was looking for.
  14. Well, can´t tell weather it´s working now or not bc you deleted my axes. Based on my original code i was expecting my merged mesh to appear in the (0, 0, 0) where the rack is. In the picture above, there is a really small blue box where the axes meet. BJS shows its coords as (0, 0, 0). Same with the merged blue mesh (the right one in the pic) which seem to have (0, 0, 0) as well. Are there different coordinate systems in BJS?
  15. Hi RaananW, sorry for my funny comments in source. ;-). Here we are:
  16. Hi everyone, new day new struggle. Problem is, I create five boxes and merge them into a new one which well. I don´t know if it´s a bug or not, but when I try to re-position the new mesh, it´s coordinates seem to be different. Same behavior with clones I make of it. The (0, 0, 0) doesn´t match the (0, 0, 0) of my scene. Here´s the code: // Variables for beam creation var beamCenterWidth = 2.7; var beamCenterHight = 0.12; var beamCenterDepth = 0.06; var beamSidePartWidth = 0.005; var beamSidePartHight = 0.24; var beamSidePartDepth = 0.08; var beamFrontPartWidth = 0.08; var beamFrontPartHight = 0.24; var beamFrontPartDepth = 0.005; // Material for beam elements var beamCenterMaterial = new BABYLON.StandardMaterial("beamCenterMaterial", scene); beamCenterMaterial.diffuseColor = new BABYLON.Color3(0, 0, 1);//Blue var beamSidePartsMaterial = new BABYLON.StandardMaterial("beamSidePartsMaterial", scene); beamSidePartsMaterial.diffuseColor = new BABYLON.Color3(1, 0, 0);//Red // Traverse basteln und eingügen var beamCenter = BABYLON.MeshBuilder.CreateBox("beamCenter", {height: beamCenterHight, width: beamCenterWidth, depth:beamCenterDepth}); beamCenter.position.x = 8; beamCenter.position.y = 3; beamCenter.position.z = 8; beamCenter.pickable= true; beamCenter.material=beamCenterMaterial; // linkes L-Stück basteln und einfügen (1.1) var beamSidePartLeft = BABYLON.MeshBuilder.CreateBox("beamSidePartLeft", {height: beamSidePartHight, width: beamSidePartWidth, depth:beamSidePartDepth}); beamSidePartLeft.position.x = 9.35; beamSidePartLeft.position.y = 3; beamSidePartLeft.position.z = 7.99; beamSidePartLeft.pickable= true; beamSidePartLeft.material=beamCenterMaterial; // rechtes L-Stück basteln und einfügen (2.1) var beamSidePartRight = BABYLON.MeshBuilder.CreateBox("beamSidePartRight", {height: beamSidePartHight, width: beamSidePartWidth, depth:beamSidePartDepth}); beamSidePartRight.position.x = 6.65; beamSidePartRight.position.y = 3; beamSidePartRight.position.z = 7.99; beamSidePartRight.pickable= true; beamSidePartRight.material=beamCenterMaterial; // linkes L-Stück basteln und einfügen (1.2) var beamFrontPartLeft = BABYLON.MeshBuilder.CreateBox("beamFrontPartLeft", {height: beamFrontPartHight, width: beamFrontPartWidth, depth:beamFrontPartDepth}); beamFrontPartLeft.position.x = 9.39; beamFrontPartLeft.position.y = 3; beamFrontPartLeft.position.z = 8.03; beamFrontPartLeft.pickable= true; beamFrontPartLeft.material=beamCenterMaterial; // rechtes L-Stück basteln und einfügen (2.2) var beamFrontPartRight = BABYLON.MeshBuilder.CreateBox("beamFrontPartRight", {height: beamFrontPartHight, width: beamFrontPartWidth, depth:beamFrontPartDepth}); beamFrontPartRight.position.x = 6.61; beamFrontPartRight.position.y = 3; beamFrontPartRight.position.z = 8.03; beamFrontPartRight.pickable= true; beamFrontPartRight.material=beamCenterMaterial; // Merge all 5 single beam meshes var meshArray = []; meshArray.push(beamCenter); meshArray.push(beamSidePartLeft); meshArray.push(beamSidePartRight); meshArray.push(beamFrontPartLeft); meshArray.push(beamFrontPartRight); var frontBeam = BABYLON.Mesh.MergeMeshes(meshArray, true, false, false); frontBeam.computeWorldMatrix(true); //worldMatrix frontBeam.position.x = 0; frontBeam.position.y = 0; frontBeam.position.z = 0; frontBeam.pickable= true; frontBeam.material=beamCenterMaterial; // Clone merged mesh var clonedBeam = frontBeam.clone("newBeam00"); clonedBeam.position.x = 4; clonedBeam.position.y = 4; clonedBeam.position.z = 4; Neither the merged mesh ("frontbeam") nor its clone ("clonedBeam") go where I want them to appear: The (0, 0, 0) of my scene is where rack meets green Y-arrow. Getting the merged mesh´s coordinates looks like this: What am I missing? Any help appreciated. Using BJS 3.1 by the way. Markus
  17. @ Wingnut Awesome. Thx for your your detailed and exhausting description. I´m gonna check this out today. BR, Markus
  18. Hi, I´m new to BJS and trying to get along with a 3D visualization for warehouses. The 2D visualization already work pretty well, the coordinates are stored in a DB running on a remote server. Target is to provide a library of rack elements (frames and beams) of different dimensions (height, width, length). I can provide a JSON from server-side Java-application with all the necessary data (rack id, rack type, coordinates, etc.) I´m using OBJFileLoader for importing obj and mtl which works fine as well. This is 2D visualization of a warehouse: Every blue rectangle is a warehouse rack consisting of two frames an a bunch of beam pairs: Both elements, frame and beam, come from separate obj-files. In the end of the day, i want to have something like this: The displayed meshes are kind of super simple, but perfect for playing around with BJS (i´ve all models in high poly as well). For some reason I can´t move (or change) meshes imported by this method: I can specify the mesh position while importing like this (works for the sphere btw.): var loader = new BABYLON.AssetsManager(scene); var pos = function(t){ t.loadedMeshes.forEach(function(m){ var meshName =; var meshID =; m.position.z = 5; m.position.x = 7; }); }; var steher1 = loader.addMeshTask("steher_2500_900_120", "", "http://localhost:8080/MagllanMain/Babylon/Cyril/", "steher_2500_900_120.obj"); steher1.onSuccess = pos; var sphere = BABYLON.Mesh.CreateSphere("sphere", 0.5, 0.5, scene); var simpleMaterial = new BABYLON.StandardMaterial("texture2", scene); simpleMaterial.diffuseColor = new BABYLON.Color3(0, 1, 0);//Green sphere.material=simpleMaterial; sphere.position.x = Math.floor((Math.random() * 2) ); sphere.position.y = Math.floor((Math.random() * 2) ); sphere.position.z=3; BABYLON.OBJFileLoader.OPTIMIZE_WITH_UV = true; loader.load(); // Begin of User interaction via button event $("#move_z").click(function(){ //scene.meshes.forEach(function(k) {alert(;}); pilot.position.z = pilot.position.z + 1; sphere.position.z = sphere.position.z + 0.4; scene.getMeshByName('steher_2500_900_120').position.z +=10; }); Funny thing is, i can move all other meshed via click-event. In general, I´ve been asking myself if I´m using the best way of doing this (import-method, file-types: obj and mtl). The workflow should be like this: 1) get JSON from server with an array of IDs and their coordinates (e.g.: ID="10012", ID_name="rack_012", ID_pos_x="130", ID_pos_y="120", etc.); 2) Importing the rack elements that belong to a specific ID into existing BJS scene; 3) Every rack element uses the same obj-file(s) (meshes) because all racks shall be of the same rack type, but with different IDs in BJS; I don´t know how to give imported meshes their own unique, custom IDs so that I can access them in the scene. More in general: I have my server-side array and i need a client-side array as well. When i change the position of let´s say 10 of 2000 racks in my layout / scene, I need to know which meshes i have to "move" on client-side. If there are any other weak points my way of trying to achieve this, please tell me. Any help appreciated !!! Topper