Refresh datas on armsglobe from server through ajax

	mapIndexedImage = new Image();
	mapIndexedImage.src = 'images/map_indexed.png';
	mapIndexedImage.onload = function() {
		mapOutlineImage = new Image();
		mapOutlineImage.src = 'images/map_outline.png';
		mapOutlineImage.onload = function(){
			loadCountryCodes(
				function(){
					loadWorldPins(
						function(){	
							loadContentData(								
								function(){																	
									initScene();
									animate();		
								}
							);									
						}
					);
				}
			);
		};			
	};		
	setInterval(mapIndexedImage.onload, 10000); // new edited line.	

Those are some lines from the file main.js. I wanted to get new datas every 1minute from server(loadContentData() does that once), this one works fine and changes the data on the Globe, but the globe crashes and doesnt move at all. what am i missing or doing wrong? Thanks for your help.

Hello theKing,

From the code snippet above I see 2 things that could be improved for performance sake.

  • First: less nested functions. Once the program reaches the initScene() function, it is in the 5th level of abstraction. It makes things difficult to debug even if the logic is right.

  • Second, “the issue/bug”: calling setInterval() spaws a new JS process. From what I see, the animate() “rendering loop” is called again in a parallel process every 10 seconds. This is the main reason the code crashes the browser.

To solve your issue, you can:

  1. init the objects and scene without data
  2. get the data once for init
  3. run the rendering loop (animate())
  4. fetch the data every 10 sec and update the objects
1 Like