0

我通过图像旋转器 .xml 配置文件在我的网站上渲染了一个 3D 模型。此功能有效，但我试图通过 JS on change 事件呈现一个完全不同的 .xml 代替以前的文件。

为了解决这个问题，我做了很多阅读，虽然我还没有找到答案。我已经尝试将 JQuery 脚本变成如下所示的函数：

function updateModel(xml_file_path) {
    console.log('updating room model...');
    console.log('xml_file_path: ' + xml_file_path);

    // clear past model
    $("#wr360PlayerId").empty();

    jQuery('#wr360PlayerId').rotator({
        licenseFileURL: 'license.lic',
        configFileURL: '/static/360_assets/' + xml_file_path,
        graphicsPath: '/static/img/basic',
        zIndexLayersOn: false,
        responsiveBaseWidth: 600,
        responsiveMinHeight: 0,
        googleEventTracking: false,
    });
    console.log('rendering: ' + xml_file_path);
}

// clears the old model then updates the configFileURL to the new model

这成功清除了以前的模型，尽管当我检查新模型时，图像旋转器使用的图像没有被加载，也没有显示任何内容。

WR360 文档

我还通读了上述 wr360 的文档，发现了几种在我的网站上加载图像旋转器的不同方法。我已经经历了每一个，并尝试使用与 JQuery 类似的方法对其进行更新，但每个都有自己难以克服的奇怪之处。

代码不多，因为大部分代码都是在页面加载时动态创建的，但我会尝试在下面提供所有必要的代码：

js

function updateModel(xml_file_path) {
    console.log('updating room model...');
    console.log('xml_file_path: ' + xml_file_path);

    // clear past model
    $("#wr360PlayerId").empty();

    jQuery('#wr360PlayerId').rotator({
        licenseFileURL: 'license.lic',
        configFileURL: '/static/360_assets/' + xml_file_path,
        graphicsPath: '/static/img/basic',
        zIndexLayersOn: false,
        responsiveBaseWidth: 600,
        responsiveMinHeight: 0,
        googleEventTracking: false,
    });
    console.log('rendering: ' + xml_file_path);
}

$(document).ready(function(){
    $('#rooms').on('change', function() {
        updateModel(room.xml_path);
        console.log('model updated');
    });
});
// truncated for simplicity

html

<div id="wr360PlayerId" class="wr360_player" style="background-color:#FFFFFF;">
</div>

xml 文件路径被正确传递（由 检查console.log('xml_file_path: ' + xml_file_path);）它只是不呈现第二个旋转器。

$('#rooms')是一个选择字段，room.xml_path是选定的房间 .xml 文件路径。话虽如此，理想情况下，on change 事件将显示所选模型，如果选择再次更改，它应该呈现新模型（而不是像当前那样）。要么我遗漏了某些东西，要么不刷新页面就无法更新模型，无论哪种方式，我们都非常感谢任何帮助！

4

1 回答 1

0

您实际上可以使用， apiObj.reload(xml_path); 简单地使用新的 xml 文件路径重新加载图像旋转器。

于 2019-06-24T22:06:24.873 回答