Bing map 3d terrain to babylonjs

Hello, buddy, I have implemented an online tool to import the terrain of Bing 3D map into the babylonjs scene. You can customize the tile size, accuracy and range. This tool can help you automatically exclude the watermark part and automatically splice tiles. Welcome to try;

Tips:you need to register the Bing map key
video:Bing map 3d terrain to babylonjs - YouTube


As far as I can see it is possible to put the result directly into the Playground, this is really great.
Could you share a PG example?

1 Like

ok,Texture is Base64,Loading may be a little slow


can i halo drop in and play some local war?


Hello, that’s pretty cool, thanks for sharing. I used the so far. I can see you added some game dev friendly parameters which should be helpful.

There is a strange behavior for some parts of the world. I have seen same issue with elevationapi. An example for testing could be Achil island in Ireland. When I map this area the whole model get squeezed vertically. In the elevationAPI only the grayscale height map get squeezed but model is fine. In your case everything get squeezed.

This is how it should look like:

and coords for the place: Google Maps

Any ideas whats the problem?

1 Like

This is usually caused by the selected coordinates being biased towards the two poles of the earth. In fact, I set a square area, but in different areas, I observed that there seemed to be different lengths and widths of rectangles, which should be related to the definition of longitude and latitude. I’m not an expert in geography. Therefore, I can’t explain the specific reason. One possibility is that the area you framed is not squeezed, It’s stretched on the 2D world map

1 Like

I played a bit more. This squeezed square happens everywhere. Another thing is, can the water contour detection be turned off? It doesnt deal well with lakes, get some weird artifacts…
One way to get around the squeegeeing is to manually adjust the width (I am not sure whats the right ratio but used 2x).

Thanks, would be cool to figure that out and have it as parameter or something. As I mentioned earlier I can manually adjust the width which is nice.

This operation is due to the need to manually calibrate the errors between the conventional map and satellite map of the Bing map API. If there is no water in the selected area, ignore the settings and click OK.

Allow me to continue to explore the API of bingmap :smiley:

Thanks, great job putting it all together.

Awesome project :slight_smile:

Just wanted to add that bing maps is actually using babylonjs in their 3d view feature. Example:

Bing Maps - Directions, trip planning, traffic cameras & more

click this square thingy:


Very cool project! :smiley:

1 Like

GLB file export is supported. :smiley:

1 Like

Now you can modify the model in any editor that supports GLB to make it more suitable for your use scenario. For example, in blender

1 Like
  • “Download Baboylonjs Code” OK;
  • “Download GLB file”, error:
KHR_materials_iridescence.ts:42 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'isEnabled')
    at KHR_materials_iridescence.postExportMaterialAdditionalTextures (KHR_materials_iridescence.ts:42:45)
    at _Exporter._extensionsPostExportMaterialAdditionalTextures (glTFExporter.ts:257:42)
    at glTFMaterialExporter.ts:390:45

Also the created “Baboylonjs Code” meshList is not working:

GLB file export has been repaired, please try again :grinning:

1 Like

Your code has duplicate parts. Please remove the duplicate code here and at the end first, and it should work normally.

1 Like

:sweat_smile: sorry, my bad, something weird happened when i pasted, it’s ok now:

1 Like