为什么文档中的海洋程序不工作并显示错误？

Question

在 Official documentation 中有一个程序，他们在其中提到了 Don McCurdy 的 aframe-extras 的参考以获取 Aframe 1.2.0。但是当我运行使用CDN制作的程序link。它永远行不通。我也收到以下错误。

我的代码是：

<!

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>

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

为什么文档中的海洋程序不工作并显示错误？

Why the ocean program in documentation is not working and showing error?

aframe