在对 Pannellum 的 javascript 调用中避免 Eval

Question

我有一个网站，我在其中使用 javascript 和 pannellum API 加载多个 360 全景视图。

浏览器偶尔会崩溃，尤其是在我的 iPhone 6 上处于 VR 模式时，不同的 DIV 中总共需要六个 pannellum 实例。

据我所知，浏览器在调用 pannellum 时崩溃，这是我从 eval 函数内部执行的操作，因为我传递给 pannellum 的数据包含在一个变量中。

这是调用，以及让我们知道全景图已加载的后续行。

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

在哪里

RightPanoInt 是一个变量，我可以用来检查全景图是否已加载

RightPanoIntermediary 是要加载全景图的 DIV 的 ID。

和

PanoDataIntermediary 是一个变量，包含 pannellum API 所需的数据/参数。

例如

{"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"}

下次调用时数据会不一样，所以参数必须在 PanoDataIntermediary 变量中。

我可以使用 eval 函数的哪些替代方法来进行相同的调用？

Answer 1

好的，上面的回答让我意识到，我真的应该使用对象，而不是使用变量。比如……

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);

这无需使用 eval 即可工作。我需要一些时间来重新整理我现有的代码，看看它是否解决了浏览器崩溃问题。

再次感谢。

Answer 2

你试过这个（没有eval）吗？

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

根据您的问题，PanoDataIntermediary 是一个保存数据的变量。您需要eval 的唯一原因是PanoDataIntermediary 仅包含保存数据的另一个变量 的名称。

此外，eval("RightPanoInt=pannellum.viewer('RightPanoIntermediary', " + PanoDataIntermediary +");"); 语句将您的 PanoDataIntermediary 对象视为字符串，但它不是字符串，因此不能连接为字符串。这可能会导致您的浏览器崩溃。至少，它抛出了一个异常。

eval 的使用示例：

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

注意：我不是在这里提倡使用eval。我只是想提供一些背景信息。

希望对您有所帮助。