【问题标题】:Why the ocean program in documentation is not working and showing error?为什么文档中的海洋程序不起作用并显示错误?
【发布时间】:2021-12-30 18:08:26
【问题描述】:

Official documentation 中有一个程序,他们在其中提到了 Don McCurdy 的 aframe-extras 以获取 Aframe 1.2.0。但是当我使用生产链接的 CDN 运行程序时。它永远不会起作用。我也收到以下错误。

我的代码是:

<!

DOCTYPE html>

<html lang="en">
    <head>
        <script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
        <script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>
        <title>Proyectos</title>    
    </head>
<body>
    <a-scene physics>
        <script>
            AFRAME.registerPrimitive('a-ocean', {
            // Attaches the `ocean` component by default.
            // Defaults the ocean to be parallel to the ground.
            defaultComponents: {
              ocean: {},
              rotation: {x: -90, y: 0, z: 0}
            },
            // Maps HTML attributes to the `ocean` component's properties.
            mappings: {
              width: 'ocean.width',
              depth: 'ocean.depth',
              density: 'ocean.density',
              color: 'ocean.color',
              opacity: 'ocean.opacity'
            }
          });
        </script>
        <a-ocean color="aqua" depth="100" width="100"></a-ocean>
      </a-scene>
</body>
</html>

【问题讨论】:

    标签: aframe


    【解决方案1】:

    a-ocean 是在 a-frame extras 中定义的,所以你不需要再定义它,你应该可以使用它。这就解释了第一个错误(“a-ocean is already registered”)。

    不幸的是,它是使用 THREE.js 几何组件编写的,该组件在 THREE.js r125 中已被弃用。

    对应于 A-Frame 1.2.0。

    这解释了第二个错误(“mergeVertices 不是函数”)。

    所以(直到有人更新 a-ocean)如果你想使用 a-ocean,你必须使用 A-Frame 1.1.0 或更早版本。

    这段代码会给你一个基本的海洋

    <html lang="en">
        <head>
            <script src="https://aframe.io/releases/1.1.0/aframe.min.js"></script>
            <script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>
            <title>Proyectos</title>    
        </head>
    <body>
        <a-scene physics>
            <a-ocean color="aqua" depth="100" width="100"></a-ocean>
          </a-scene>
    </body>
    </html>
    

    在修复 a-ocean 方面,看起来已经做了一些工作: https://github.com/n5ro/aframe-extras/issues/362

    该问题包含用于修复的示例代码,但尚未将其提交到 PR...

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-12-07
    • 1970-01-01
    • 2015-03-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多