I'm using Photo Sphere Viewer to show 360 images. I have a menu on the bottom with other 360 images. When i click one of these images, the photosphere change the image in the viewer. After changing the image about 3 or more times, the browser become slow.
The method I'm using is "empty()" from jquery to erase the old panorama image and then load again a "photoSphereViewer" and i think that's the problem. For some reason, when i use empty doesn't remove the image on the cache and after a time it become slow. I know that exist a method to change the panorama with "setPanorama", but when I try, the console shows an error that PSV (the variable) is not a function.
//here is the panorama add it to the dom
$(window).load(function(){
PSV = new PhotoSphereViewer({
panorama: '',
container: 'photosphere',
default_fov: 65,
mousewheel: false,
loading_img:'img/loader3.gif',
cache_texture:0,
transition:{duration:1500, loader:true},
});
});
//then a function with ajax (im using php) that set the URL:
$.ajax({
type:'post',
url:'query/menu_r.php',
data:{consulta:consulta, codigoFull:codigoFull},
success:function(data){
ruta = "content/"+recinto+"/"+vista+"/cu"+silestone+"/"+calidad+"/";
ruta = ruta+data;
//vacío container del 360.
//$("#photosphere").empty();
PSV.setPanorama(ruta, null, true );
}
})
With the old method (empty the container and add the new panorama) works, but I have this performance issue. So I need to find a way to clean the cache or set the panorama without create it again everytime. any idea? Thanks!!
finally i found a solution. I let it here if anyone need it someday. I finally used Pannellum library and I talked with the author. He gave me a very simple and effective solution. Just loading one viewer and using a method like "addScene" and "removeScene" the garbabe collector doesn't load and everything runs pretty well. If someone needs more information, here is the thread:
https://github.com/mpetroff/pannellum/issues/763
Cheers!