Integrating WebGL Earth in Babylon.JS?

[Raggar]

This is something I've been giving some thought since trying the Pokemon Go game.

Is there any way of integrating the WebGL Earth in a Babylon.js scene?

Taking a look at the Hello World example of the WebGL Earth: http://examples.webglearth.com/#helloworld

This would be a decent suit for an augmented reality type game like Go. Try zooming in on the map, the tiles are perfect for this type of game.

It's just a matter of getting the GPS coordinates at a fixed interval(Using the geolocation API), and have an animated player model. That would be the basics, and leaving all the real game designing and server handling to the individual coders.

 

I couldn't get them to merge, as it seems the globe project creates a scene and camera itself, and therefore can't easily be part of a Babylon scene. At least as far as I can tell.

Does anyone know if there is any existing example of anything similar for Babylon or maybe Three.js?

 

I'm fairly certain this could spawn a new wave of interesting 'low-budget' augmented reality games.

 

[Wingnut]

Hiya @Raggar, welcome to the forum.  Good to have you with us.

No replies yet, huh?  Sorry.  About the closest we've seen... is http://makina-corpus.com/blog/metier/2014/how-to-use-multimaterials-with-a-tiled-ground-in-babylonjs .  Interesting topic/ideas, for sure.  Sorry I don't have more "goods".

Maybe use THIS playground as a starter.  It is ALMOST the same as the playground demo from the above webpage, except I remarked-out line 83, an unnecessary line.  (bloat prevention). 

Perhaps use our LOD system or shoot a distance-checking ray at the map plane... determine when it's time to re-tile/re-draw the map? (zoom in/out feature) 

Open Street Map tiles... yum!  I like 'em.  Got more thoughts?  Let's hear 'em.  We love mad scientist experiments like these. 

[Raggar]

Hi @Wingnut

Thank you for your reply, as well as your welcome.

This was mostly to get an idea of whther or not it is actually possible, as I have 2 other projects eating up my focus right now.

I looked at both links, and it certainly looks like it might be possible with a little hacking around.

I did this very quick and (ugly) test of the playground scene from your first link. I simply added a call to the geo API:

http://www.babylonjs-playground.com/#1BMKOU

 

It requires Firefox, though, as Chrome won't access location data without the connection enforcing security by TLS/SSL.

 

When I get more time, I'll look ways of getting location data into actual points on the tiles.

[chicagobob123]

What I have been looking for is an implementation of Virtual Textures. The code is above my head as it requires some shader coding to make it happen. 

It would allow a google earth kind of zoom in to the world ability. Would be great for Geo as well as games with endless worlds. 

I am attaching the pdf. 

 

VirtualTextureWebGL.pdf

[Pryme8]

I've already researched this, you just need to get the hightmaps and then grab the satellite layer as the texture.  It's pretty simple once you get your data converted.

you can also access topology layers that have height information.  The problem I ran into though was resolution, and had to start going with LAR GS data.

[chicagobob123]

Sorry Pryme8 what did you research? If its virtual texturing then I have no idea on how heightmaps matter. 

I would think you could make use of OpenStreetMap data maps 

this is what I think can be done with Virtual textures. 

www.openstreetmap.org