Sectioning

Below we will consider how the sectioning functionality works and how to manage this. C3D Web Viewer API provides to add two different objects of sectioning to a scene:

• planes;

• box.

Each of objects can be created and added to a scene via the following command.

SetSectionCommand type (TypeScript):

export type SetSectionCommand = {
    name: "SetSectionCommand"
    params: C3DSectionParams
}

In this type the property params allows you to specify the sectioning object and its options.

C3DSectionParams type (TypeScript):

export type C3DSectionParams =
    | {
        name: "C3DSectionPlanes"
        planes: C3DSectionPlane[]
    }
    | {
        name: "C3DSectionOBB"
        box: C3DSectionOBB
        options?: {
            id?: number
        }
    }
    | {
        name: "C3DSectionAABB"
        box: C3DSectionAABB
        options?: {
            id?: number
        }
    }

Important

When calling the command, all current sectioning objects, if any, are removed from a scene and replaced by new objects specified via the params property.

Note

For now, it’s possible to add either section planes or one section box to a scene.

New in version 1.8.0: Added the section box functionality.

Below we will consider each object and examples of how to apply the sectioning command in more detail.

Section Plane

This sectioning object, as is clear from the title, allows adding a plane to a scene.

Note

For now, it’s allowed to add only 6 section planes.

New in version 1.8.0: Increased the number of planes simultaneously in a scene from 4 to 6.

You can add a plane via the following command.

Example of the command to add a section plane (TypeScript):

view.runCommand({
    name: "SetSectionCommand",
    params: {
        name: "C3DSectionPlanes",
        planes: [{
            placement: {
                a: 0,
                b: 1,
                c: 0
            },
            options: {
                direction: 'back'
            }
        }]
    }
})

The parameter planes defines an array of new section planes.

Each plane is an instance of the following type:

type C3DSectionPlane = {
    placement: {
        a: number,
        b: number,
        c: number
    },
    options?: {
        id?: number
        direction?: "front" | "back"
    }
}

The parameter placement defines a section plane in 3D which contains:

• a: an angle (in radians);

• b: an angle (in radians);

• c: an offset along the X-axis.

Also there is an optional parameter options which can contain:

• id: a custom user id used to identify a section plane in an external user system;

• direction: a section plane splits a model into two parts and the option defines which of them is shown, the other one is hidden (the default value is "front").

Interactive Adding

In addition to the section plane process, this allows to create a section plane by three points on a model interactively.

After starting the process, a section plane is passed to the callback onInitPlacement where it’s added to a scene.

Example of adding a section plane via the plane process (TypeScript):

view.runCommand({
    name: "RunProcessCommand",
    process: {
        name: "SetPlaneProcess",
        events: {
            onInitPlacement: (a: number, b: number, c: number) => {
                const plane = {
                    id: 1,
                    placement: {a, b, c},
                    name: 'Section plane 1'
                }

                view.runCommand({
                    name: "SetSectionCommand",
                    params: {
                        name: "C3DSectionPlanes",
                        planes: [plane]
                    }
                })
            }
        }
    }
})

Section Box

This sectioning object, as is clear from the title, allows you to add the box to a scene. The section box represents a simple cube which covers the part of any geometry inside of it and cuts off the remaining part which is left outside.

Note

For now, it’s allowed to add only one box.

The section box can be defined by two types. The first one below defines options of the section box based on the Oriented Bounding Box (OBB).

export type C3DSectionOBB = {
    position: C3DViewPoint
    rotation?: {
        aboutX?: number
        aboutY?: number
        aboutZ?: number
    }
    size: C3DViewBoxSize
}

The type has the following options:

• position specifies an origin of box in global CS;

• rotation allows to set angles of rotation about the main axes of a box in radians;

• size specifies a size of box along the main axes (X - width, Y - depth, and Z - height).

The second type below defines options of the section box based on the Axis-aligned Bounding Box (AABB).

export type C3DSectionAABB = {
    min: C3DViewPoint
    max: C3DViewPoint
}

The type has the following options:

• min specifies a minimum point of box in the global CS;

• max specifies a maximum point of box in the global CS.

You could possibly notice that the C3DSectionParams type introduced above has an additional option for the section box.

Extract from C3DSectionParams type (TypeScript):

export type C3DSectionParams =
    | {...}
    // C3DSectionOBB
    | {
        ...,
        options?: {
            id?: number
        }
    }
    // C3DSectionAABB
    | {
        ...,
        options?: {
            id?: number
        }
    }

It’s an options object that has the following property:

• id: a custom user id used to identify a section box in an external user system.

Example of the command to add a section box (TypeScript):

view.runCommand({
    name: "SetSectionCommand",
    params: {
        name: "C3DSectionAABB",
        box: {
            min: {
                x: 0,
                y: 0,
                z: 0
            },
            max: {
                x: 10,
                y: 10,
                z: 10
            },
        }
    }
})