Overview
OpenGeometry is the underlying geometry kernel used by OpenPlans. It provides WebAssembly-powered geometric operations and core type definitions. The kernel is initialized through the setupOpenGeometry() method on the OpenPlans instance.
Core Types
Vector3
Represents a 3D point or vector in space.
import { Vector3 } from '@opengeometry/openplans';
const point = new Vector3(x, y, z);
Example:
const center = new Vector3(0, 1, 0);
const offset = new Vector3(5, 0, 3);
Interface Definitions
ILineOptions
Configuration options for creating a line.
interface ILineOptions {
ogid?: string;
start: Vector3;
end: Vector3;
color: number;
}
Optional unique identifier
Starting point of the line
Hexadecimal color value (e.g., 0x000000 for black)
IArcOptions
Configuration options for creating an arc.
interface IArcOptions {
ogid?: string;
center: Vector3;
radius: number;
startAngle: number;
endAngle: number;
segments: number;
color: number;
}
Optional unique identifier
Starting angle in radians
Number of segments for curve smoothness (e.g., 16, 32)
IRectangleOptions
Configuration options for creating a rectangle.
interface IRectangleOptions {
ogid?: string;
center: Vector3;
width: number;
breadth: number;
color: number;
}
Optional unique identifier
Center point of the rectangle
Breadth (height) of the rectangle
IPolylineOptions
Configuration options for creating a polyline.
interface IPolylineOptions {
ogid?: string;
points: Vector3[];
color: number;
}
Optional unique identifier
Array of Vector3 points defining the polyline path
ICuboidOptions
Configuration options for creating a cuboid (3D box).
interface ICuboidOptions {
ogid?: string;
center: Vector3;
width: number;
height: number;
depth: number;
color: number;
}
Optional unique identifier
Center point of the cuboid
Height dimension (Y-axis)
ICylinderOptions
Configuration options for creating a cylinder.
interface ICylinderOptions {
ogid?: string;
center: Vector3;
radius: number;
height: number;
color: number;
}
Optional unique identifier
Center point of the cylinder
Kernel Classes
The OpenGeometry kernel provides low-level geometry classes that are extended by OpenPlans primitives and shapes:
Line
Base class for line geometry.
import { Line, Vector3 } from '@opengeometry/openplans';
const line = new Line({
start: new Vector3(0, 0, 0),
end: new Vector3(5, 0, 0),
color: 0x000000
});
Arc
Base class for arc geometry.
import { Arc, Vector3 } from '@opengeometry/openplans';
const arc = new Arc({
center: new Vector3(0, 0, 0),
radius: 2,
startAngle: 0,
endAngle: Math.PI,
segments: 32,
color: 0x000000
});
Rectangle
Base class for rectangle geometry.
import { Rectangle, Vector3 } from '@opengeometry/openplans';
const rect = new Rectangle({
center: new Vector3(0, 0, 0),
width: 4,
breadth: 2,
color: 0x0000ff
});
Polyline
Base class for polyline geometry.
import { Polyline, Vector3 } from '@opengeometry/openplans';
const polyline = new Polyline({
points: [
new Vector3(0, 0, 0),
new Vector3(1, 0, 0),
new Vector3(1, 0, 1)
],
color: 0x0000ff
});
Polygon
Base class for polygon geometry.
import { Polygon, Vector3 } from '@opengeometry/openplans';
const polygon = new Polygon({
vertices: [
new Vector3(0, 0, 0),
new Vector3(1, 0, 0),
new Vector3(1, 0, 1),
new Vector3(0, 0, 1)
],
color: 0x00ff00
});
Cuboid
Base class for 3D box geometry.
import { Cuboid, Vector3 } from '@opengeometry/openplans';
const cuboid = new Cuboid({
center: new Vector3(0, 1, 0),
width: 2,
height: 3,
depth: 1,
color: 0x8B4513
});
Cylinder
Base class for cylinder geometry.
import { Cylinder, Vector3 } from '@opengeometry/openplans';
const cylinder = new Cylinder({
center: new Vector3(0, 1.5, 0),
radius: 0.5,
height: 3,
color: 0xCCCCCC
});
Opening
Base class for architectural openings (doors, windows).
import { Opening, Vector3 } from '@opengeometry/openplans';
// Opening is typically extended by BaseDoor, BaseSingleWindow, etc.
const opening = new Opening({
center: new Vector3(0, 1, 0),
width: 1,
height: 2.1,
depth: 0.2,
color: 0x8B4513
});
Initialization
OpenGeometry must be initialized before using geometry operations:
import { OpenPlans } from '@opengeometry/openplans';
const container = document.getElementById('viewport');
const op = new OpenPlans(container);
// Initialize the geometry kernel
await op.setupOpenGeometry();
// Now you can use geometry methods
const line = op.line({
startPoint: [0, 0, 0],
endPoint: [5, 0, 0],
color: 0x000000
});
Custom WASM URL
You can specify a custom WebAssembly module URL:
await op.setupOpenGeometry('/custom/path/to/opengeometry.wasm');
Type Exports
All geometry types and interfaces can be imported from the main package:
import {
// Core Types
Vector3,
// Interface Definitions
ILineOptions,
IArcOptions,
IRectangleOptions,
IPolylineOptions,
ICuboidOptions,
ICylinderOptions,
// Kernel Classes
Line,
Arc,
Rectangle,
Polyline,
Polygon,
Cuboid,
Cylinder,
Opening,
// Main Class
OpenPlans
} from '@opengeometry/openplans';
Working with Coordinates
Converting Array to Vector3
When working with the OpenPlans API, you can use simple arrays for coordinates, which are internally converted to Vector3:
// Using arrays (OpenPlans API)
const line = op.line({
startPoint: [0, 0, 0], // Array format
endPoint: [5, 0, 0], // Array format
color: 0x000000
});
// Using Vector3 directly (Kernel API)
import { Line, Vector3 } from '@opengeometry/openplans';
const kernelLine = new Line({
start: new Vector3(0, 0, 0), // Vector3 format
end: new Vector3(5, 0, 0), // Vector3 format
color: 0x000000
});
Vector3 Operations
Vector3 supports common vector operations:
import { Vector3 } from '@opengeometry/openplans';
const v1 = new Vector3(1, 2, 3);
const v2 = new Vector3(4, 5, 6);
// Access components
console.log(v1.x, v1.y, v1.z); // 1, 2, 3
// Set components
v1.set(10, 20, 30);
// Copy from another vector
v1.copy(v2);
// Clone a vector
const v3 = v1.clone();
Color Values
All color parameters accept hexadecimal color values:
// Common colors
const black = 0x000000;
const white = 0xffffff;
const red = 0xff0000;
const green = 0x00ff00;
const blue = 0x0000ff;
// Using in geometry
const line = op.line({
startPoint: [0, 0, 0],
endPoint: [5, 0, 0],
color: 0x000000 // Black line
});
const cuboid = op.cuboid({
center: new Vector3(0, 1, 0),
width: 2,
height: 3,
depth: 1,
color: 0x8B4513 // Wood brown
});
Example: Creating Complex Geometry
import { OpenPlans, Vector3 } from '@opengeometry/openplans';
const container = document.getElementById('viewport');
const op = new OpenPlans(container);
// Initialize kernel
await op.setupOpenGeometry();
// Create a complex polyline path
const path = op.polyline({
points: [
[0, 0, 0],
[5, 0, 0],
[5, 0, 5],
[7, 0, 5],
[7, 0, 8],
[0, 0, 8],
[0, 0, 0]
],
color: 0x000000
});
// Add an arc at a corner
const cornerArc = op.arc({
center: [5, 0, 5],
radius: 0.5,
startAngle: 0,
endAngle: Math.PI / 2,
segments: 16,
color: 0xff0000
});
// Create a 3D element
const column = op.cylinder({
center: new Vector3(2.5, 1.5, 2.5),
radius: 0.3,
height: 3,
color: 0xCCCCCC
});