javascript - 由于缺少方法而导致PanoJS失败

我在Rails 4项目中使用PanoJS，但出现以下错误:

TypeError: this.getLevel(...) is undefined
[panojs/pyramid_imgcnv.js][1] Line 92

我感到困惑的是，该方法似乎只在上面几行声明了。

我已经将其作为PanoJS的一个问题提出，但我怀疑这仅仅是Rails和Javascript之间的配置错误。以前，我已经设置了它并与Rails 3项目一起工作。我使用了相同的JS文件，并以相同的顺序加载它们。我看不到有什么区别(Rails版本除外)，但是一种版本有效，而另一种版本无效。

更新:

将该元素声明为(为简洁起见，我省略了数据部分)；

%div{ id: "image_viewer", class: "viewer", data: {} }

JS应该使用以下coffeescript触发，但目前我已将其注释掉，因为它只是添加了一个错误，因为addimagezoom无法正常工作。

jQuery(document).ready ($) ->

  $('#zoomimage').addimagezoom
  largeimage: $('#zoomimage').data('large-image-url'),
  magnifiersize: [$('#zoomimage').data('scaled-x-dimension'),$('#zoomimage').data('scaled-y-dimension')],
  zoomrange: [2, 10]

更新2:

我意识到我在原始帖子中犯了一个错误。触发实际上如下。以上是我尝试使其他查看器工作时的人工制品。下面是真正的触发条件。

createViewer viewer, 'image_viewer', "#{url_base}/#{image_id}", "#{image_uuid}_", width,  height, target_format

最佳答案

好的，这真的很难，因为无法看到所有代码正在运行。但是作为一个夏洛克想要，我可以看到:

该错误表明this.getLevel(...)的结果在文件panojs/pyramid_imgcnv.js的第92行中未定义。源文件指出:

ImgcnvPyramid.prototype.tile_filename = function( level, x_coordinate, y_coordinate ) {
    var l = formatInt( this.getLevel(level).level , 3);
    ...
}

这意味着level的值会在undefined中生成getLevel()的结果。查看getLevel()，我们可以看到:

ImgcnvPyramid.prototype.getLevel = function( level ) {
    if (level<this._pyramid.length)
        return this._pyramid[ level ];
    else
        return this._pyramid[ this._pyramid.length-1 ];
}

因此level是:
A.未定义，或
B.指向一个不存在的数组位置的负数，或者
C.数组_pyramid中该位置存储的值未定义

如果我们搜索调用了ImgcnvPyramid.tile_filename函数的任何实例，则可以看到在源代码中的其他任何地方都没有调用它。这意味着实现该库的用户必须调用它。因此，让我们检查一下(并假设)您正在以与演示页面相同的方式来实现插件。

该演示覆盖了tileUrlProvider.assembleUrl方法。当您要覆盖要使用的每个图块的url时，应实现此功能。在演示实现中，我们可以看到以下内容:

var myProvider = new PanoJS.TileUrlProvider('','','');
myProvider.assembleUrl = function(xIndex, yIndex, zoom) {
    return MY_URL + '/' + MY_PREFIX + myPyramid.tile_filename( zoom, xIndex, yIndex );
}

如果我们遵循源代码中的路径，则传递到用户定义的zoom方法中的assembleUrl变量应为undefined或负值，假设加载时发生错误，则可能是错误地计算了缩放级别。内line行可能会变成:

PanoJS.js[88]
this.zoomLevel = (typeof options.initialZoom == 'undefined' ? -1 : parseInt(options.initialZoom));

根据此“分析”，这很有意义，因为返回的默认值为-1。因此，总而言之，初始化全景图时请添加initialZoom值

viewer = new PanoJS(dom_id, {
    initialZoom: 0, // and play with this value to see what happens
    ...
});

另外，在触发器中检查width和height的值
createViewer viewer, 'image_viewer', "#{url_base}/#{image_id}", "#{image_uuid}_", width, height, target_format
如果其中之一为负数，零或未定义，则可能在计算过程中错误地计算了缩放值。

抱歉，如此冗长，可能对其他人有帮助，希望对您有所帮助。请让我们知道这些建议是否有效，否则，请发布一个URL，我们可以在其中查看代码的运行情况。