1

I have a website in which I use javascript and pannellum API to load multiple 360 panoramic views.

Occasionally the browser crashes, particularly when on my iPhone 6 in VR mode when a total of six pannellum instances are required in different DIVs.

As best I can tell, the browser crashes on the call to pannellum which I am doing from inside an eval function as the data I pass to pannellum is contained in a variable.

Here's the call, plus the subsequent line that lets us know that the panorama is loaded.

eval("RightPanoInt=pannellum.viewer('RightPanoIntermediary', " + PanoDataIntermediary +");");
RightPanoInt.on("load", function() { LoadedRightPanoIntermediary(); });

Where

RightPanoInt is a variable I can use to check if the panorama is loaded

RightPanoIntermediary is the id of the DIV the panorama is to be loaded into.

and

PanoDataIntermediary is a variable containing the data / parameters need by the pannellum API.

For example

{"autoLoad": true,"pitch": 0,"yaw": 73,"vaov": 180,"haov": 360,"vOffset": 0,"maxPitch": 90,"minPitch": -90,"maxYaw": 180,"minYaw": -180,"maxHfov": 100,"hfov": 100,"minHfov": 10,"showFullscreenCtrl": false,"orientationOnByDefault": false,"showControls": false,"panorama": "002.jpg","preview":"BackgroundPaleGreen.jpg"}

The data will be different the next time the call is made, so the parameters must be in the PanoDataIntermediary variable.

What alternative method to the eval function can I use to make the same call?

Derek
  • 53
  • 8
  • why can't you do `const RightPanoInt=pannellum.viewer('RightPanoIntermediary', PanoDataIntermediary);`? is there a specific reason you need to use eval? – Bargros Dec 05 '18 at 09:28
  • you can also use a dynamic function instead of eval. In many cases there are similar but the dynamic function provides for less awkward results than eval – Nikos M. Dec 05 '18 at 10:31

2 Answers2

2

Okay, the responses above have made me realise that instead of using a variable, I really should be using an object. For example...

var PanoDataIntermediary={"type":"equirectangular"}; // to initiate
PanoDataIntermediary.panorama="Church_HDR_x4_000.jpg"; // to add more parameters
PanoDataIntermediary.autoLoad = true;   
PanoDataIntermediary.pitch=0;
PanoDataIntermediary.yaw=73;
PanoDataIntermediary.hoav=360; // etc
RightPanoInt=pannellum.viewer('panorama', PanoDataIntermediary);

This will work without the need for using eval. It will take me awhile to rehash my existing code to see if it resolves the browser crash problem.

Thanks again.

Derek
  • 53
  • 8
1

Have you tried this (without eval)?

var RightPanoInt = pannellum.viewer('RightPanoIntermediary', PanoDataIntermediary);

According to your question, PanoDataIntermediary is a variable holding data. The only reason you'd need eval is if PanoDataIntermediary merely held the name of another variable that held the data.

Furthermore, the statement eval("RightPanoInt=pannellum.viewer('RightPanoIntermediary', " + PanoDataIntermediary +");"); treats your PanoDataIntermediary object as if it were a string but it is not a string and so cannot be concatenated as a string. This may be causing your browser crash. At the very least, it's throwing an exception.

A sample use of eval:

var myVariable = {a: 1, b:2, c:'test'};
var myVariableName = 'myVariable';
alert(eval(myVariableName).c);

Note: I'm not promoting the use of eval here. I'm just trying to offer some context.

Hope that helps.

Jonathan Wilson
  • 4,138
  • 1
  • 24
  • 36
  • Thanks for the help guys. I initially tried this without the eval as Bargros suggested, but for whatever reason this did not pass the necessary parameters need by Pannellum. The eval solution appears to work most of the time, but appears to be unstable, maybe because of the exception you refer to. Can you elaborate? – Derek Dec 05 '18 at 21:00
  • My answer assumes your `PanoDataIntermediary` variable holds an object but maybe it actually holds a JSON string. I cannot quite tell without seeing your full program listing. Maybe try `var RightPanoInt = pannellum.viewer('RightPanoIntermediary', JSON.parse(PanoDataIntermediary));` – Jonathan Wilson Dec 05 '18 at 21:05
  • Hi Jonathan, you've hit the nail on the head, I've been using a string variable when I should have been using an object. – Derek Dec 05 '18 at 21:36