如何将 x3dom 与聚合物一起使用？

Question

我有一个 polymer 站点，我想在其中使用 x3dom 库来查看外部 x3d 文件，并且能够将加载的 3D 场景简单地旋转 360 度。

有人成功地将 x3dom 与 polymer 结合使用了吗？我不明白为什么这行不通。请假设我拥有正确的所有聚合物材料（我拥有）并且已经在页面头部加载了先决条件 x3dom.js 脚本和 x3dom.css。这只是显示关键位的精简代码片段：

 <x3d width='350px' height='400px'>
      <scene>
           <inline nameSpaceName="myNS" mapDEFToID="true" url="{{_x3dPath}}"></inline>
      </scene>
 </x3d>

 <script>
      Polymer({
           properties: {
                _x3dPath: {type: String},
           }, 

           ready: function() { 
                this._x3dPath = "/someDynamicPath/threeDfile.x3d";
           }
      });
 </script>

有什么建议吗？

Answer 1

您需要创建一个自定义元素作为第 3 方库的包装器。（例如 x3dom-wrapper.html ）。

在该文件中，您必须添加对 x3dom .js 的脚本引用

<script type="text/javascript" src='../bower_components/x3dom/x3dom.js'></script>

然后，您需要像导入任何其他聚合物组件一样导入包装自定义元素。这样您就可以确保 x3dom 依赖项在您需要时可用。

编辑：包装库仍然是一个好习惯，但不是问题的根源。我做了一个快速测试，发现您必须在 "ready" 聚合物事件处理程序上调用 x3dom.reload()。这样 x3dom 系统就会正确地重新加载

如何将 x3dom 与聚合物一起使用？

How to use x3dom with polymer?

x3dom

polymer

polymer-1.0