# Indexed Face Set

<Scene> <Shape> <Appearance> </Appearance> </Shape> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> <Billboard> <Shape> </Billboard> </Scene>

An IndexedFaceSet is used to define a polygonal shape. For example, it can be used to model a building. The building geometry is given by a set of points P={P0, P1, ..., Pn} and a set of polygons F={F0, F1, ..., Fm}. Each point Pi is given by its coordinates Pi=(xi,yi,zi). Each polygon Fi is defined by a list of m coplanar points (m >=3) given in counterclockwise order: Fi=(Pi0, Pi1, ... Pim)

    	Example:
    	P = {P0, P1, P2, P3, P4, P5, P6, P7, P8}
    	with
            P0 = (-1.0, 0.0,  1.0)
    	P1 = ( 1.0, 0.0,  1.0)
    	P2 = ( 1.0, 0.0, -1.0)
    	P3 = (-1.0, 0.0, -1.0)
            P4 = (-1.0, 2.0,  1.0)
    	P5 = ( 1.0, 2.0,  1.0)
    	P6 = ( 1.0, 2.0, -1.0)
    	P7 = (-1.0, 2.0, -1.0)
    	P8 = ( 0.0, 3.0,  0.0)
    	F = {F0, F1, F2, F3, F4, F5, F6, F7, F8}
            wall:
            F0 = (P0, P1, P5, P4)
            F1 = (P1, P2, P6, P5)
    	F2 = (P2, P3, P7, P6)
    	F3 = (P3, P0, P4, P7)
    	ground:
    	F4 = (P0, P3, P2, P1)
    	roof:
    	F5 = (P7, P4, P8)
    	F6 = (P4, P5, P8)
    	F7 = (P5, P6, P8)
    	F8 = (P6, P7, P8)

In the IndexedFaceSet the point set P is defined in the Coordinate node. The set of polygons F is defined in the attribute coordIndex. Each polygon is given by a list of point indices followed by -1 to indicate the end of a polygon and the beginning of a new one.

    <html>
    <head>
        <title>My first X3DOM page</title>
        <script type='text/javascript' src='http://www.x3dom.org/download/x3dom.js'> </script>
        <link rel='stylesheet' type='text/css' href='http://www.x3dom.org/download/x3dom.css'></link>
    </head>
    <body>
        <X3D id="shapedata" width="600px" height="600px" style="float:left">
            <Scene>
            <Shape>
                    <Appearance>
                        <Material diffuseColor="0.5 0.5 0.5"> </Material>
                    </Appearance>
                <IndexedFaceSet solid="true" ccw ="true"
                    coordIndex=" 0 1 5 4 -1 1 2 6 5 -1 2 3 7 6 -1
                                    3 0 4 7 -1 0 3 2 1 -1 7 4 8 -1
                                    4 5 8 -1 5 6 8 -1 6 7 8 -1">
                    <Coordinate point="-1 0 1, 1 0 1, 1 0 -1, -1 0 -1,
                                    -1 2 1, 1 2 1, 1 2 -1, -1 2 -1, 0 3 0 " >
                    </Coordinate>
                </IndexedFaceSet>
            </Shape>
            </Scene>
        </X3D>
    </body>
    </html>