Gijs

Members
  • Content Count

    141
  • Joined

  • Last visited

Everything posted by Gijs

  1. You can modify BABYLON.VertexData.CreateGroundFromHeightMap to check if a point is in the transparent zone, and set the height to a custom value. If you set it to a special value you can recognize later, you can use that in the part where the indices are set, and correct one or two of the "transparent" vertices. An added bonus is that if all three vertices are "transparent", you can leave the triangle out completely (save on geometry)!
  2. Hi, do you have the latest version of BJS? The FadeInOutBehavior was added only 24 days ago: https://github.com/BabylonJS/Babylon.js/commits/ea60de4002a2cb92706eb09aa25e728584826e22/src/Behaviors/Mesh/babylon.fadeInOutBehavior.ts
  3. Hi, you can lower the maxHeight parameter of CreateGroundFromHeightMap: https://playground.babylonjs.com/#2WFHNI#1
  4. Hi, You have this quaternion multiplication order reversed: this.rotationQuaternion = this._rq.multiply(_q); Should be: this.rotationQuaternion = _q.multiply(this._rq); http://www.babylonjs-playground.com/indexStable.html#DVUAAQ#3
  5. It works the same on planets: http://www.babylonjs-playground.com/#F6P9N4#1 If you want more terrains, have a look at MixMaterial: https://doc.babylonjs.com/extensions/mix
  6. You can use TerrainMaterial for the land and water: https://doc.babylonjs.com/extensions/terrain For the mixTexture you can use DynamicTexture: https://doc.babylonjs.com/how_to/dynamictexture Then to detect what the user clicked, you can use the texture coords from the pickResult to get the picked pixel from the canvas: https://www.babylonjs-playground.com/#E6OZX#208
  7. You're welcome... and right of course, my answer wasn't exactly what you asked! This is more like it: function getTextureImage(texture, _canvas){ let canvas = _canvas ? _canvas : document.createElement('canvas'); let ctx = canvas.getContext('2d'); let size = texture.getSize(); let pixels = texture.readPixels(); canvas.width = size.width; canvas.height = size.height; ctx.putImageData(new ImageData(new Uint8ClampedArray(pixels), size.width, size.height), 0, 0); return canvas; } That would be your image_from_diffusetexture
  8. Hi! It was an interesting thing to figure out. Here is a solution: CanvasRenderingContext2D.prototype.drawTexture = function(texture, x, y){ let size = texture.getSize(); let pixels = texture.readPixels(); this.putImageData(new ImageData(new Uint8ClampedArray(pixels), size.width, size.height), x, y); } So then you would call drawTexture instead of drawImage
  9. I don't know what the best way is, but I did it by manually setting the TextBlock top and left each frame: To get the screen position of something on screen: function worldToScreen(worldVec: BABYLON.Vector3, engine: BABYLON.Engine, scene: BABYLON.Scene) { let identity = BABYLON.Matrix.Identity(); let viewport = scene.activeCamera!.viewport.toGlobal(engine.getRenderWidth(), engine.getRenderHeight()); let transform = scene.getTransformMatrix(); return BABYLON.Vector3.Project(worldVec, identity, transform, viewport); } Then I set the top and left, like this (note the 30 px): let pos = worldToScreen(node.position, engine, scene); textBlock.left = pos.x - this.canvas.width / 2; textBlock.top = pos.y - this.canvas.height / 2 - 30;
  10. That's awesome! And it's notable how so much was going on behind the scenes before making it to the convention, which is something that is easily overlooked. This is also good news: I've been assured by the creators and lead developers of babylon.js that they have secured an agreement with Microsoft ensuring the framework remain open source and free. It would be cool if I could scan my face on my Xperia.. 🤩 . Thank you for your service.
  11. Hi Mackey, I watched the video, and I tried some things, but to no avail... but then I found this: https://answers.unity.com/questions/1206428/how-weights-of-2d-blending-are-calculated.html Seems like the answer is somewhere in there, now you just gotta make sense of it 🤔 I wish I could be of more help, because it's a really nice project you are working on! Keep it up! 🙂
  12. This function gets called in the end of the creation function when you create a BJS mesh like a plane: https://github.com/BabylonJS/Babylon.js/blob/67e5c07c225f02fc3a880ea7ccb1fa8332687595/src/Mesh/babylon.mesh.vertexData.ts#L2729 So that's how meshes get their sides changed from the initial front side; their vertex data get changed. That's my 2 cents.
  13. Reading the Shadertoy comments, apparently @BitOfGold made this shader and used it in his BJS project here: https://www.bitofgold.com/ocean/ @BitOfGold, nice work! What are your thoughts on this? And the shader code is licensed under the default Shadertoy license, right? (CC Attribution-NonCommercial-ShareAlike 3.0 Unported)
  14. Or you could make an addCurveTo method using a Curve3, like this (not tested): BABYLON.Path2.prototype.addCurveTo = function(redX, redY, blueX, blueY){ let points = this.getPoints(); let lastPoint = points[points.length - 1]; let origin = new BABYLON.Vector3(lastPoint.x, lastPoint.y, 0); let control = new BABYLON.Vector3(redX, redY, 0); let destination = new BABYLON.Vector3(blueX, blueY, 0); let nb_of_points = 10; let curve = BABYLON.Curve3.CreateQuadraticBezier(origin, control, destination, nb_of_points); let curvePoints = curve.getPoints(); for(let i=1; i<curvePoints.length; i++){ this.addLineTo(curvePoints[i].x, curvePoints[i].y); } }
  15. You could use Curve3 instead of Path2, and turn the curve into a Path2 later if you need that. Then instead of addLine, you make a new Curve3 that is the line, and use yourCurve.continue(the new curve) to get the added curve. To get the quadratic curve, you can use: https://doc.babylonjs.com/how_to/how_to_use_curve3#quadratic-bezier-curve Good luck with your project
  16. You could overwrite the function that draws the background color: http://www.babylonjs-playground.com/#VEHQTQ#2
  17. How about bone._martix.invert()?
  18. You could take the initial rotation and the lookAt rotation (Quaternions), and interpolate between them (slerp): http://www.babylonjs-playground.com/#JEHHJ2
  19. Hi all, I have this playground: http://www.babylonjs-playground.com/#V3N96R In it, there is box, and an instance of box, which is box2. box has isVisible set to false, and after 1000 ms, has its material changed to swapMat. This is what happens then: Chrome/Opera: When swapMat is normalMat, nothing seems to happen. When swapMat is set to greenMat, box2 disappears, and the following errors show: Firefox/Edge: When swapMat is normalMat, box2 turns white. When swapMat is greenMat, box2 turns green with no errors. Setting isVisible to true right before/after changing the material makes it work as expected. The same happens in the stable version. What could it be? Thanks.
  20. I don't know what causes it, but can't you just remove the timeout?
  21. It's not failing to compile, it's only saying there's an error. It'll run just fine.
  22. I found this, maybe it's that again?:
  23. Live demo: https://hegieq.home.xs4all.nl/games/gardentrains/sponza.html