如何使用x3dom与聚合物？(How to use x3dom with polymer?)

如何使用x3dom与聚合物？(How to use x3dom with polymer?)

我有一个聚合物网站，我想使用x3dom库来查看外部x3d文件，并且只需将加载的3D场景旋转360度即可。

有没有人成功地使用x3dom与聚合物？ 我没有看到为什么这不起作用的任何理由。 请假设我所有的聚合物都是正确的（我有）并且已经在页面的头部加载了先决条件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>

有什么建议么？

I have a polymer site where I'd like to use the x3dom library to view an external x3d file, and simply be able to rotate the loaded 3D scene 360 degrees.

Has anyone successfully used x3dom with polymer? I don't see any reason why this wouldn't work. Please assume I have all the polymer stuff correct (which I have) and have loaded the prerequisite x3dom.js script and x3dom.css in the head of the page too. This is just a stripped down code snippet to show key bits:

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

Any suggestions?

最满意答案

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

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

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

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

编辑：包装库仍然是一个很好的做法，但不是问题的原因。 我做了一个快速测试，发现你必须在你的“ready”聚合物事件处理程序上调用x3dom.reload（）。 这样x3dom系统可以正常重新加载

You need to create a custom element that serves as a wrapper for the 3rd party library. (e.g x3dom-wrapper.html ).

Inside that file, you must add the script reference to x3dom .js

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

Then, you need to import the wrapper custom element like any other polymer component. That way you ensure the x3dom dependency will be available when you need it.

Edit: Wrapping the library is still a good practice but not the cause of your problem. I did a quick test and found that you must call x3dom.reload() on your "ready" polymer event handler. That way x3dom system reloads properly