使用 HTML x3DOM 使用挤压制作 3D 圆弧

Question

我试图查找信息，但一般找不到关于 html x3dom 的很多信息，无论如何我想使用挤压在 3D 中制作一个弧形，但我只得到这个形状：

这是我的代码：

<html>
<head>
    <meta charset="utf-8">
    <title>Arc X3D</title>
    <script type='text/javascript' src='x3dom-full.js'>
    </script>
    <link rel='stylesheet' type='text/css' href='x3dom.css' />
</head>
<body>
    <x3d width="512px" height="512px">
        <scene>
            <background skyColor="0.9375 0.8984 0.5469"><!-- khaki -->
            </background>
            <switch whichChoice="-1">
            <extrusion id="arc" convex="false"
                  crossSection="
                  0.5 -1
                  0.5 1
                  -0.5 1
                  -0.5 -1
                  0.5 -1"
                  spine="
                  0 -1 0
                  0 -.9 0
                  0 -.7 0
                  0 -.5 0
                  0 0 0
                  0 .5 0
                  0 .7 0
                  0 .9 0
                  0 1 0"
                  scale="
                  1 1
                  0.9 1
                  0.8 1
                  0.7 1
                  0.6 1
                  0.7 1
                  0.8 1
                  0.9 1
                  1 1">
            </extrusion>
            </switch>
            <transform id="Arc">
                <transform translation="0 0 0" scale="1 2 1">
                    <shape>
                        <appearance>
                            <twosidedmaterial diffuseColor="red"></twosidedmaterial>
                        </appearance>
                        <x3dgeometrynode use="arc"></x3dgeometrynode>
                    </shape>
                </transform>
            </transform>
        </scene>
    </x3d>
</body>
</html>

有没有办法让它向内弯曲，另一边向外弯曲，得到弧形？

提前致谢。

Answer 1

更改一些内容后，我找到了问题的解决方案：

<extrusion id="arc" convex="false"
   crossSection="
        -1 -0.5
        -0.7 -0.4
        -0.4 -0.35
        0 -0.3
        0.4 -0.35
        0.7 -0.4
        1 -0.5
        1 0.2
        0.7 0.3
        0.4 0.35
        0 0.4
        -0.4 0.35
        -0.7 0.3
        -1 0.2
        -1 -0.5
        "
    spine="
        0 -1 0
        0 0 0
        "
     scale="
        1 1
        1 1
        ">
 </extrusion>

解决方法是在2D中制作圆弧形状，然后通过挤压赋予它体积

最终结果：

使用 HTML x3DOM 使用挤压制作 3D 圆弧

Making a 3D arc using extrusion with HTML x3DOM

html

3d

x3d