# Tim_Rosskamp

Members

7

• Rank
Newbie
1. ## Create sphere from height map?

@NasimiAsl Well, I looked at the source code from CreateGroundFromHeightMap and I thought maybe its possible to take the same approach as this function and write a new function that does the same thing for a sphere. But currently this is my code: import BABYLONX from './plugins/GeometryBuilder.SGB.js'; BABYLONX.GeometryBuilder.InitializeEngine(); BABYLONX.ShaderBuilder.InitializeEngine(); export function createEarthMesh(heightMap) { var img = document.createElement('img'); var canvas = document.createElement('canvas'); var GB = BABYLONX.GeometryBuilder; var CreatePlanet = function(op, GB) { var builder = function(s /*{seg:number}*/ , geo){ var seg = s.seg; var hseg = seg; var hmap = function(p){ p = norm(p); // read pixel from canvas var ns = 53.*canvas.getContext('2d').getImageData( (p.u*200), ( ((1.-(p.v+0.5))*200)), 1, 1).data[1]/255; p.x *=300+ ns; p.y *=300+ ns; p.z *=300+ ns; return p; } var norm = function(v){ var x = v.x, y = v.y, z = v.z; var n = Math.sqrt(x * x + y * y + z * z); if (n == 0) return { x: 0.1, y: 0.1, z: 0.1 }; var invN = 1 / n; v.x *= invN; v.y *= invN; v.z *= invN; return v; } var def = function(a, d){ if (a != undefined && a != null) return (d != undefined && d != null ? a : true); else if (d != _null) return (d != undefined && d != null ? d : false); return null; } // calculate sphere var f = function(i, j, y){ y = def(y, 0.); var a = i * 360. / seg; var v = { x: Math.sin((Math.PI / 180.) * a) * 3., y: j * 2. / seg, z: Math.cos((Math.PI / 180.) * a) * 3. }; var p = { x: v.x * Math.sin(v.y * Math.PI / 2. - Math.PI / 2.), y: Math.sin(v.y * Math.PI / 2.) * 3 + y, z: v.z * Math.sin(v.y * Math.PI / 2. + Math.PI / 2.) }; return p; }; // make sphere points for (var i = 0; i < seg + 1; i++) { for (var j = -hseg / 2.; j < hseg / 2.; j++) { var p = { x: 0, y: 0, z: 0, u: i / seg, v: j / seg }; if (j <= -hseg / 2. + 1.) { p = { x: 0., y: -3., z: 0., u: i / seg, v: j / seg }; p = hmap(p); } else if (j >= hseg / 2. - 1.) { p = { x: 0., y: 3., z: 0., u: i / seg, v: j / seg }; p = hmap(p); } else { p = f(i * 1.0, j * 1., 0.); p.u = i / seg; p.v = j / seg; p = hmap(p); } // make vertex and uv GB.PushVertex(geo, p); geo.uvs.push(i / seg, (j / seg + 0.5)); } } // make face for (var j = 1.; j < hseg - 1; j++) { for (var i = 1; i < seg + 1; i++) { GB.MakeFace(geo, [(i - 1) * hseg + j, (i - 1) * hseg + j + 1, (i) * hseg + j, (i) * hseg + j + 1], { flip: 0, faceUVMap: "0123" }); } } }; return new BABYLONX.Geometry(GB.GeometryBase(op, builder, op.custom)); } img.onload = function(){ canvas.width = img.width; canvas.height = img.height; canvas.getContext('2d').drawImage(img, 0, 0, img.width, img.height); var mesh = CreatePlanet({ seg:200. },GB).toMesh(window.Scene); console.log(mesh); } img.src = heightMap; } and this is the error I get: Uncaught ReferenceError: i is not defined at Function.BABYLONX.GeometryBuilder.BuildBabylonMesh (eval at GeometryBuilder.InitializeEngine
2. ## Create sphere from height map?

@Sebavan @NasimiAsl This would be indeed really helpful. I cant get the playground example to work in my project.
3. ## Create sphere from height map?

Hey, In my project I need to create a sphere with a height map, but I only found the function "CreateGroundFromHeightMap" in the babylonjs docs. It seems like there is not a function for spheres. Can anybody help me with that? Basicly I need the function "CreateSphereFromHeightMap".
4. ## get data from Texture

I dont really get how this is working. It seem like babylon doesnt cache my textures by default, so i have to enable it. The Documentation says I need to create a NameOfYourScene.babylon.manifest file. But I dont have a Scene Name... And the file needs to be in my document root? This seems to be a bit odd to me. Or do I just dont get the concept of this?
5. ## get data from Texture

Hey, i'm trying to get the data source from a loaded Texture in BABYLON. But I haven't found a way to do this. Basicly my idea is to get the data from the image and save it as base64 in the local cache. And then I can get the image from the cache again and load it into BABYLON. This should improve performance and result in faster loading times once you already loaded the scene once. Does this accually makes sense or is there a better way of caching textures?
6. ## solved [SOLVED] BABYLON.Vector3.Project returning NaN

Dude, thanks a lot! This was indeed the problem! I only used the function once when the component mounts and didn't tested it in the render loop.
7. ## solved [SOLVED] BABYLON.Vector3.Project returning NaN

Hey, I have a problem with the function Project function inside the Vector3 class. This is my code: var screenXY = BABYLON.Vector3.Project( new BABYLON.Vector3(10, 10, 10), BABYLON.Matrix.Identity(), scene.getTransformMatrix(), camera.viewport.toGlobal(engine.getRenderWidth(true), engine.getRenderHeight(true)) ); What I want to do is get the 2d screen x/y position from a 3d vector. And this is what gets returned from the function: Vector3 {x: NaN, y: NaN, z: NaN} How can I fix this?