Jump to content

need to create a 3D map with elevation point in meter coming from google dem api


Recommended Posts


i need to create a 3D image with the elevation data provided by google in meters unit. I don’t want to use heightmap image. I need to create it with the xyz coordinates. The elevation value coming from the dem api are in meters. I don’t know how to calculate the x and z corresponding to this elevation value in meters.Please help me with some examples.

Link to comment
Share on other sites

Hi, welcome to the forum.  Those structures are called "heightMap" and "displacementMap" in BabylonJS.  Sometimes two words... "height map".

You can do a forum search, docs search or playground search... for those terms.

The basic playground demo for height maps... is at:  https://playground.babylonjs.com/#95PXRY#0

Importing tiff files... I don't know about that, sorry.  Stay tuned for more comments.

Also, feel free to edit the TOO LONG title/subject field...  for your first post.  (thx).

Link to comment
Share on other sites

Thanks wingnut, actually I don’t want to create it with the heightmap image. I want to create it with xyz geographic coordinates. Now I am confused about to create x and z value corresponding to the elevation values that are in meters. The elevation points I am getting from the Geotiff file. I am reading that Geotiff file with Geotiff.js library.

Link to comment
Share on other sites

I just was looking into this myself a few months ago, though I was pulling from offline open source ASTER Sat Images as Google  / Bing API Costs $ and as I am working in a fairly remote part of Madagascar right now internet is not reliable (often not existent), so in my case everything has to be designed to work offline :x

Hope this helps:

Andy Beaulieu had a nice tutorial with code to pull from Bing API: http://www.spritehand.com/2013/12/bing-3d-maps-using-webgl-and-babylonjs.html

The Google API is obviously are not identical but under the hood they have similar functionality / way of doing things. It should give you some ideas if nothing else.

The Dynamic Terrain Plugin is a good place to start for creating terrain tiles from height maps, using the metadata in the GeoTIFF you can set vertical Scale  & AGL of each tile so they line up : Dynamic Terrain: https://doc.babylonjs.com/extensions/dynamic_terrain

Just a cool demo from Dotvision: http://live2.dotvision.com/live/virtualTour?guid=f0045a3c-6c11-4329-b881-8d8a170538fb&lang=fr&intro=true

Happy Coding!

Link to comment
Share on other sites

Hi Calsa,

Thanks for the help. I have tried all these above but didn't get anything. Actually i am not able to calculate x,y and z coordinates. my elevation point is coming in meters(unit). from the geotiff file i get the rasterData with the size of width * height. now i am confused how to project it with x and y so that i can get the correct elevation on texture image.


Link to comment
Share on other sites

The elevation scale needs to be calculated from the data you exported from the api.

Let s say you export a 2 * 2 m area, it means that x and z would be between between 0 and 2 so you need to remap them from 0 - 90 to 0 - 2:  https://www.babylonjs-playground.com/#FJNR5#287 As the elevation is in meter it does not need to change.

That said it is still strange to have lots of 0 in those data creating weird discontinuities everywhere.


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...