• Content Count

  • Joined

  • Last visited

Everything posted by Yazheirx

  1. If the solution is working with a standard mouse and none of the playgrounds are working for you then it is not the constructor. I would assume it is how the trackpad drivers are interacting with the browser. I don't think I can be of much help there. Hopefully, some of the more senior members of this forum will be able to assist in that direction. However, I have two more things that I would check: Try a different browser (if you are testing in Safari try in Chrome) Have a co-worker with a trackpad try to use the same application (this would be to check for company policies configuring the driver oddly)
  2. Have you tried using a normal mouse? I exclusively use an Apple Track Pad and an ArcRotate caméra for my current project. I had some trouble until I used the correct constructor. You could also check the Playgrounds for ArcRotate an see if any of them work with your track pad... then “borrow” their constructor.
  3. SOLVED: all cleaned up now: function resetPack(scene) { // iterate from the end of the mesh array to the beginning, removing any boxes found for (currentMesh = scene.meshes.length - 1; currentMesh > -1; currentMesh--) { // only remove a mesh if it has 24 Vertices - meaning it is a box if (scene.meshes[currentMesh].geometry.getTotalVertices() == 24) { index = scene.removeMesh(scene.meshes[currentMesh], true); } } }
  4. Oh, wait, I think I understand. Would it work better if iterated from the tail of the mesh array? for(currentMesh = scene.meshes.length-1; currentMesh > -1; currentMesh --) { if (scene.meshes[currentMesh].geometry.getTotalVertices() == 24) { console.log(currentMesh + ") Removing " + scene.meshes[currentMesh].name); index = scene.removeMesh(scene.meshes[currentMesh], true); console.log(index + " Removed"); } else { console.log(currentMesh + ") Not removing (" + scene.meshes[currentMesh].name + ") with (" + scene.meshes[currentMesh].geometry.getTotalVertices() + ") geometry"); } } If I am understanding correctly, by removing a node from the array as I am 'climbing' it I drive it out of bounds?
  5. function resetPack(scene) { console.log(scene.meshes.length); for (currentMesh = 0; currentMesh < scene.meshes.length; currentMesh++) { // console.log(scene.meshes[currentMesh].geometry.getTotalVertices()); if (scene.meshes[currentMesh].geometry.getTotalVertices() == 24) { console.log(currentMesh + ") Removing " + scene.meshes[currentMesh].name); index = scene.removeMesh(scene.meshes[currentMesh], true); console.log(index + " Removed"); } else { console.log(currentMesh + ") Not removing (" + scene.meshes[currentMesh].name + ") with (" + scene.meshes[currentMesh].geometry.getTotalVertices() + ") geometry"); } } } In the above code, I am trying to remove all cuboid forms from my scene. All of my cuboid meshes are made with the same code: function createPackObject(shapeName, shape, dimensionsJSON, diffuseColor, offsetX, offsetY, alpha, scene) { // console.log('Creating ' + shapeName); switch (shape) { case "cuboid": // console.log('Creating ' + shapeName + ' as a cuboid'); var packObject = BABYLON.MeshBuilder.CreateBox(shapeName, { width: dimensionsJSON[0].value, depth: dimensionsJSON[1].value, height: dimensionsJSON[2].value }, scene); packObject.position = new BABYLON.Vector3(offsetX, ((dimensionsJSON[2].value / 2) + offsetY), 0); packObject.material = new BABYLON.StandardMaterial(shapeName + "Material", scene); packObject.material.diffuseColor = diffuseColor; packObject.material.alpha = alpha; packObject.material.wireframe = false; break; default: console.log('Shape "' + solutionSet.containers[container].spaceToFill.shape + '" not handled'); } } function loadSolution(scene, camera, solutionID) { // ... // create shipping containers for (currentContainer = 0; currentContainer < solutionSet.containers.length; currentContainer++) { // ... createPackObject(containerShapeName + "I", containerInnerShape, containerInnerDimensions, new BABYLON.Color3(1, 0.87, 0.386), containerOffset, wallThickness, 0.55, scene); createPackObject(containerShapeName + "O", containerOuterShape, containerOuterDimensions, new BABYLON.Color3(1, 0.87, 0.386), containerOffset, 0, 0.55, scene); // ... for (currentItem = 0; currentItem < solutionSet.containers[currentContainer].items.length; currentItem++) { createPackObject(itemShapeName, itemOuterShape, orientedDimensions, itemColor, itemOffset, 0, 1, scene); } } } For some reason when I get to a mesh created for the containers the next item mesh I try to remove exits the function. Does anyone have any idea what might be happening, or if there is a better way to remove a particular type of mesh from a scene?
  6. Thank you that is exactly what I was looking for I am using VS Code, but my intellisense seems to be incomplete. I think that is because I am using a CDN rather than having everything dowloaded.
  7. Assuming all I can pass to a function is the major objects (scene, canvas, camera, etc) what is the best way to reference a specific Mesh? I am hopeful that I can create a function with a constructor like: function moveMesh(meshName, scene){ //select the namedMesh victimMesh.position = new BABYLON.Vector3(0,0,0); } I will actually create a key set to animate the Mesh move, but I am not skilled enough in JS to know how to select the child object I want. I know I saw the method in one of the tutorials, but I have watched over 40 hours of tutorials on youtube and can't remember where I saw it.
  8. Cube done. See https://www.babylonjs-playground.com/#GVBL74#4 for my final alignment code. Note: I only did Align Fronts, Backs, Tops, Bottoms, and LeftFaceToRightFace. Obviously there are all the other two more side alignments (lefts and rights) and 5 more face alignments to do, but if anyone needs this solution in the future a modification of the whiteboard math posted above should allow you to come up with it quickly.
  9. I will look at the snapping code in the future when the product moves in to "Gamification" mode. But for now my goal is to show a set of random items allow the user to either click each item, or click a UI button to show where each item will go relative to the rest of the items. Basically step by step visual packing instructions
  10. I can now align any faces I want. https://www.babylonjs-playground.com/#GVBL74#3 Here is the key code: function alignFronts(targetBox, movingBox) { // leave the X and Y where they are targetX = movingBox.position.x; targetY = movingBox.position.y; //only move the Z targetZ = targetBox.position.z + targetBox.getBoundingInfo().boundingBox.maximumWorld.z - movingBox.getBoundingInfo().boundingBox.maximumWorld.z; movingBox.position = new BABYLON.Vector3(targetX, targetY, targetZ); }; and here is the whiteboard diagram I had to draw to figure it out in the end: Let me know if anyone can find a more robust solution.
  11. Maybe my question should be: If you are attempting to manipulate multiple, dissimilarly dimensioned, boxes - how do you compensate for the differences in the faces to the center to allow two faces to be aligned I am just thinking out loud here let's take the same three boxes from an earlier entry: 1x1x2 1x1x2 1x2x2 and let's assume I want to move box1 to be next to box3. By next to I mean: front faces aligned lengths of two (2) side by side, and the bottoms aligned (so I can later put box2 on top of box 1 to finish my cube). I will put something in a playground soon and post it
  12. @JohnK before calling it a night, I came to the same conclusion about pivots. As my end goal is to combine multiple box sizes to make a single shape. I think I am going to have to create a function to translate the movement off of a standard point on each box (let’s say the front lower left hand corner) to move things in a predictable method. To visualize the problem set image you have three boxes 1x1x2 1x1x2 1x2x2 with proper manipulation they should be able to be assembled in a 2x2x2 cube.
  13. Ok, I have found that .position moves the "center of the mesh". http://doc.babylonjs.com/babylon101/position. As I am trying to move boxes to touch one another I am going to try to read the pivot document referenced to figure out how to get edges to touch http://doc.babylonjs.com/how_to/pivots Does anyone know of a page or playground that animates items to or from a touching, but not collision, state?
  14. Considering this code: var shippingContainer = BABYLON.MeshBuilder.CreateBox("Box", { depth: 3, width: 2, height: 2 }, scene); shippingContainer.position = new BABYLON.Vector3(0, 2, 0); Have I moved a corner of the box to 0,2,0, and edge, or the center mass? Are there any good playgrounds that would clarify this?
  15. Here is another resource I have used: http://www.custommapmakers.org/skyboxes.php
  16. Thank you that seems to have worked. I am past that error (on to the next several hundred 😀) . I will have to look into pep.js as well.
  17. Due to my setup I am using the CDN link for BabylonJS. When I attempt to instantiate the GUI command I get a: [Error] TypeError: undefined is not an object (evaluating 'new BABYLON.GUI.GUI3DManager') createScene (ui.js:12) (anonymous function) (ui.js:24) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>GC3 UI POC</title> <script src="https://cdn.babylonjs.com/babylon.max.js"></script> <style>#canvas { width:100%; height:100%; }</style> </head> <body> <canvas id="canvas"><script src="js/ui.js"></script></canvas> </body> </html> based on they following code: window.addEventListener('DOMContentLoaded', function(){ var canvas = document.getElementById('canvas'); var engine = new BABYLON.Engine(canvas, true); var createScene = function (){ var scene = new BABYLON.Scene(engine); scene.clearColor = new BABYLON.Color3.White(); var camera = new BABYLON.ArcRotateCamera('camera1', 0, 0, 10, new BABYLON.Vector3(0, 0, 0), scene); camera.setPosition(new BABYLON.Vector3(0,0,20)); camera.attachControl(canvas, true); var manager = new BABYLON.GUI.GUI3DManager(scene); /* var manager = new BABYLON.GUI.GUI3DManager(scene); var button1 = new BABYLON.GUI.HolographicButton("down"); manager.addControl(button1); button1.setPosition(new BABYLON.Vector3(10, 10, 0)); button1.text = "X"; */ var box = BABYLON.Mesh.CreateBox("Box", 4.0, scene); return scene; } var scene = createScene(); engine.runRenderLoop(function(){ scene.render(); }); }); Is there a different src file I should be including? Can I not use the GUI object when using the CDN src? Any help would be appreciated for this JS and Babylon newb.