Debug
Back to the reference

Debug

Lines, grids and axes drawn over the scene, to see what the game is doing.

9 symbols

useHelperAxisfunctionhooknacatamalon

useHelperAxis(options: TUseHelperAxisOptions) => TLines

Draws the three axes as coloured lines from where it is placed: X red, Y green, Z blue, the colours every 3D tool uses.

Made inside something, it shows which way that thing is turned, because the lines are measured from it and turn with it. Made in the scene, it marks the world's origin.

Parameters

optionsTUseHelperAxisOptions

How long the arms are, their colours, and where the gizmo goes.

Example

const Level = () => {
    useCamera3d({ projection: 'perspective', fov: 60, y: 1, z: 4, rotationX: -0.2 });
    useHelperAxis({ size: 2, negative: true });
    return createScene();
};
View source · hooks/helpers/use_helper_axis.ts:83

useHelperGridfunctionhooknacatamalon

useHelperGrid(options: TUseHelperGridOptions) => TLines

Draws a floor grid on the ground plane, the one every 3D editor shows, with its middle lines in the colours of the X and Z axes.

It is drawn in the scene like anything else, so a model standing on it hides the lines behind it instead of the grid being painted over everything. Raise it, turn it or stand it up with transform.

Parameters

optionsTUseHelperGridOptions

How big it is, how close its lines are, and their colours.

Example

const Level = () => {
    useCamera3d({ projection: 'perspective', fov: 60, y: 4, z: 8, rotationX: -0.45 });
    useHelperGrid({ half: 5 });
    return createScene();
};
View source · hooks/helpers/use_helper_grid.ts:64

useHelperLinesfunctionhooknacatamalon

useHelperLines(options: TUseHelperLinesOptions) => THelperLines

Draws any lines you like, and hands back the function that replaces them at any time.

The one to reach for when what has to be seen changes: an outline that follows what the player picked, the path an enemy is about to take, the shape of a collider being tuned. The axis gizmo and the floor grid are this with the corners worked out for you.

Each corner is seven numbers, x, y, z, r, g, b, a, and every two corners make a line. They are measured from where the lines are placed, so lines made inside a moving thing move with it. setVertices copies what it is given, so the same array can be reused every frame.

Lines are drawn in the scene's 3D view: models in front hide them, and they hide what is behind them. They are one pixel wide.

Parameters

optionsTUseHelperLinesOptions

The first lines, and where they are drawn from.

Example

declare const target: { x: number; y: number; z: number };

const Level = () => {
    useCamera3d({ projection: 'perspective', fov: 60, z: 6 });
    const [, setPath] = useHelperLines();

    useUpdate(() => {
        // One yellow line from the origin to wherever the enemy is heading.
        setPath(new Float32Array([0, 0, 0, 1, 1, 0, 1, target.x, target.y, target.z, 1, 1, 0, 1]));
    });

    return createScene();
};
View source · hooks/helpers/use_helper_lines.ts:66

TNewLinesOptionstypenacatamalon

What every way of making lines shares: where they go, and whether they are drawn.

Properties

nameoptionalstring

A name to find the lines by.

transformoptionalPartial<TTransform3d>

Where the lines are drawn from. Left out, the place of whatever they are made in.

zIndexoptionalnumber

Draw order within the scene, as for any other drawing.

visibleoptionalboolean

Whether they start drawn. Default true.

View source · gameobjects/lines/new_lines.ts:20