Help optimizingcan

I started a question previously, about help extruding on a sphere. Prev question

Now that I have it working, I have been trying to optimize the performance. I am on the road atm, so I don’t have a PG yet, but will try to update tonight

On my machine in chrome, I get 50 fps, which is good. I just need smooth, so higher isn’t really needed.

However, on ie 11, fps was in high teens. I fixed this by using the scene optimizer, aND that was good.

Last night I tried it in my Chromebook, and it was 12 fps max, with optimize on. I thought maybe my Chromebook doesn’t have a GPU or maybe it’s just bad, but the Kaspersky map works great.

How can I find the performance culprit? I noticed my cpu went to 100% utilization. At first I thought my maths for calculation of vertices could be at issue, but that’s a one time thing, and my fps never improves after it finishes.

This leads to how can I optimize in specific ways. I have a globe, and the camera target is always the center of it. I have set the lower radius to 3.1, to keep the camera from hitting the mesh. Is there something I can do to tell the engine the following:

1: don’t bother drawing anything inside sphere. I think I have backface culling false on my meshes.

2: would turning off checkCollisions help the cpu?

3: I am drawing extrusion and such, which generates many vertices. Would it be better to make the countries in something like blender and export it to Babylon? Then maybe I just need to center it by position and smile? I am also projectng the country to a 2d ish look. But my fps issue is just sitting at globe looking at it.

4:. Given its a sphere, at most 50% of meshes are visible. When you zoom in to 3.1 radius, that drops to like 15% visible. Does babylon automatically handle this for optimize? I am using Arc rotate camera.

I have seen some articles, and I am working through em, but really just hoping to find a way to identify where the cpu is being murdered.


Several thoughts about this very interesting topic.
The initial “task” was to create something similar to the Kaspersky globe in Babylon

By the way, Kaspersky also has much simpler globe
Both examples, as I suppose, are made with Three.js

  1. The “country extrusion” function could be very useful in some cases, so there is definitely some sense to improve it further.
  2. Maybe another - deforming - approach is possible. So, for example, you have country polygon, or just box, on the plane. In order to fit the sphere you need to deform them; since the sphere has constant circumflexion everywhere, it could be easier to do than extrusion. This function also would be very useful for further uses. Here is small video about C4D deformer - YouTube
  3. In the first example there is 3D model with countries; the model itself is made in some DSS tool.
    Here is the similar or maybe the same model - 3d model earth countries
    108 000 vertices - quite optimized.
  4. So at the moment it would be much easier to use ready 3D model. For the low end solution it is also possible to imitate effects of countries bump with texture effects etc.
    Still the main impact is achieved with animated labels and particles; actually the Kaspersky example is quite simple from JS geometry point of view. There are no extrusions or other geometry changes made with JS.
  5. Kind of conclusion. While the functions which allow to make the relief globe still need to be improved, the task itself could be reformulated:
    How to do something similar to the Kaspersky globe in Babylon, but much better and in more usable and scalable way? As I see it, the main problem actually is labelling and other UI things, for extruded countries it is easier to use ready 3D model.

I ran into technical difficulties with my travel this weekend, but am back now.

Thanks for your response. I notice in the Kasperky map, they have faces defined in their JSON payload. I was unable to decode it fully, but my guess is they just have the models pre-made like you say, and just render them. I liked the link you sent for the textured countries, will think about that a little bit.

When you say the Kasperksy map does not have geometry changes, are you looking at just the globe? Because they have a button to convert from globe to a flat plane. In my research on this, that seems to be a geometry change. I do a projection for the vertices to a Van Der Gritten transform, and animate there. I’m looking at the animation and seeing if I can make that smoother as well, but a globe doesn’t lie flat without geometry changes, right? or is there something simple I am missing? Since the polygons take into account the curve of the earth, how would they “flatten” without some changes?

I’m still curious for pointers on how to find where my performance bottleneck is. My chromebook isn’t the shiniest thing out there, but the perf drop seems crazy to me. specifically it looks like it might be rendering in software only mode, but I have not found out how to tell if this is the case.


Seems it is good illusion masking the mesh changing (there is the moment when particle change from globe to plane); or it could be animation made in DCC.
For the sake of successful development I would split the task into 2 parts.

  1. Functions for (geodesical, but not only) extruding, deforming etc. Would be nice to have possibility to use height maps for the spheres and other objects. Or input coordinates and get mesh on the surface of sphere, etc.
  2. Use simplified version of the globe with nice textures, create necessary illusions with textures etc.
    Build a simple service for global (on the globe) or local (on the plane) companies.
    Something like that:
    Visitor can input towns where he has main office and branch offices;
    Some function puts coords and names of these cities on the globe/plane;
    Adding nice effects, particles and labelling (phone numbers, websites etc)
    Now Babylon Globe is ready to be embedded into the client’s site through the simple HTML code with Babylon Viewer.