Line

The Line class creates a line connecting multiple points in 3D space.

Import

import { Line } from "mage-engine";

Constructor

new Line(points, options);

Parameters

Parameter	Type	Default	Description
points	Array	[]	Array of point objects {x, y, z}
options	Object	{}	Line options

Options

Option	Type	Default	Description
color	number	0xffffff	Line color
dashed	boolean	false	Creates dashed line if true
thickness	number	2	Line width

Properties

Property	Type	Description
vertices	Array	Array of points defining the line

Examples

Basic Line

import { Line } from "mage-engine";

// Create a simple line
const line = new Line([
  { x: 0, y: 0, z: 0 },
  { x: 10, y: 10, z: 0 },
  { x: 20, y: 0, z: 0 },
]);

Colored Line

// Create a red line
const line = new Line(
  [
    { x: 0, y: 0, z: 0 },
    { x: 50, y: 0, z: 0 },
  ],
  { color: 0xff0000 }
);

Dashed Line

// Create a dashed line
const line = new Line(
  [
    { x: 0, y: 0, z: 0 },
    { x: 0, y: 50, z: 0 },
  ],
  { dashed: true, color: 0x00ff00 }
);

Thick Line

// Create a thick line
const line = new Line(points, { thickness: 5 });

Complex Path

// Create a path with multiple segments
const path = new Line(
  [
    { x: 0, y: 0, z: 0 },
    { x: 10, y: 5, z: 0 },
    { x: 20, y: 0, z: 5 },
    { x: 30, y: 10, z: 10 },
    { x: 40, y: 0, z: 5 },
  ],
  { color: 0xffaa00, thickness: 3 }
);

Methods

setVertices(vertices)

Updates the line's vertices dynamically.

// Update the line path
line.setVertices([
  { x: 0, y: 0, z: 0 },
  { x: 100, y: 100, z: 0 },
]);

setThickness(value)

Sets the line width.

line.setThickness(4);

computeLineDistances()

Computes line distances (required for dashed lines).

line.computeLineDistances();

Inherited Methods

The Line inherits methods from the Element class:

• setPosition(x, y, z) - Set the line's position
• setRotation(x, y, z) - Set the line's rotation
• setScale(x, y, z) - Set the line's scale
• setColor(color) - Change the line's color

Serialization

// Serialize to JSON
const json = line.toJSON();

// Create from serialized data
const restoredLine = Line.fromJSON(json);

See Also

• CurvedLine - For smooth curved lines
• Element - Base class documentation