[SOLVED] Making a 3D arc using extrusion with HTML x3DOM

Making a 3D arc using extrusion with HTML x3DOM

I tried to find information but cant find much info on html x3dom in general, anyway i want to make an arc shape in 3D using extrusion, but i am only getting this shape:

Here is my code:

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

Is there a way to make it bend inwards while bending outwards on the other side, to get the arc like shape?

Thanks in advance.

Solution

After changing a few things i found a solution to the problem:

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

The solution is to make the arc shape in 2D and then give it volume through extrusion

Final result: