Class HeightDrawing

HeightDrawing – Specialized drawing for visualizing and measuring height between 3 points in 3D.

Extends Drawing to support 3 interactive points (lowest, middle, highest), auto-adjusts the intermediate point vertically, and displays colored lines for visualization.

Provides separate properties for controlling point and line color, and manages visibility and destruction for all involved Cesium entities.

Param: app

The Cesium or host application instance.

Param: options

Param: options.points

Optional initial array of Cartesian positions.

Param: options.pointColor

The color used for the points.

Param: options.lineColor

The color for the lines.

Param: options.addPoint

Whether to immediately add the first point on construction.

Param: options.onMoveCallback

Callback when a point is moved.

Param: options.onSetCallback

Callback when a point is set.

Param: options.onFinishCallback

Callback when drawing is finished.

Example

const drawing = new HeightDrawing(viewer, {
  pointColor: Cesium.Color.ORANGE,
  lineColor: Cesium.Color.DEEPPINK,
  onFinishCallback: () => { ... }
});

// The drawing manages all Cesium entities for the user interactively.

Hierarchy (View Summary)

Drawing
- HeightDrawing

Index

Constructors

constructor

new HeightDrawing(app: any, options?: object): HeightDrawing
Parameters
- app: any
  The application context.
- Optionaloptions: object = {}
  See class description for available options.
Returns HeightDrawing
Overrides Drawing.constructor
- Defined in src/Core/Drawing/HeightDrawing.js:61

Properties

app

app: any

destroyed

destroyed: undefined | boolean

id

id: any

line

line: null | Entity[]

Array of Cesium Entity polylines.

lines

lines: undefined | any[]

onFinishCallback

onFinishCallback: any

onMoveCallback

onMoveCallback: any

onSetCallback

onSetCallback: any

point

point: undefined | PointEntity

pointSet

pointSet: PointSet3D

Accessors

cartesians

get cartesians(): Cartesian3[]
Access the current array of point positions.

Returns Cartesian3[]
Inherited from Drawing.cartesians
- Defined in src/Core/Drawing/Drawing.js:91
set cartesians(value: Cartesian3[]): void
Parameters
- value: Cartesian3[]
Returns void
Inherited from Drawing.cartesians
- Defined in src/Core/Drawing/Drawing.js:94

color

get color(): Color
The color applied to the points.

Returns Color
Inherited from Drawing.color
- Defined in src/Core/Drawing/Drawing.js:102
set color(value: Color): void
Parameters
- value: Color
Returns void
Inherited from Drawing.color
- Defined in src/Core/Drawing/Drawing.js:105

finished

get finished(): boolean
Indicates if drawing is finished.

Returns boolean
Inherited from Drawing.finished
- Defined in src/Core/Drawing/Drawing.js:126
set finished(value: boolean): void
Parameters
- value: boolean
Returns void
Inherited from Drawing.finished
- Defined in src/Core/Drawing/Drawing.js:129

lineColor

get lineColor(): Color
The color used for all connecting lines.

Returns Color
- Defined in src/Core/Drawing/HeightDrawing.js:218
set lineColor(value: Color): void
Parameters
- value: Color
Returns void
- Defined in src/Core/Drawing/HeightDrawing.js:221

maxPoints

get maxPoints(): number
The maximum number of points.

Returns number
Inherited from Drawing.maxPoints
- Defined in src/Core/Drawing/Drawing.js:138
set maxPoints(value: number): void
Parameters
- value: number
Returns void
Inherited from Drawing.maxPoints
- Defined in src/Core/Drawing/Drawing.js:141

pointColor

get pointColor(): Color
The color for the points.

Returns Color
- Defined in src/Core/Drawing/HeightDrawing.js:240
set pointColor(value: Color): void
Parameters
- value: Color
Returns void
- Defined in src/Core/Drawing/HeightDrawing.js:243

points

get points(): any[]
Current set of points (last uncommitted included if drawing).

Returns any[]
- Defined in src/Core/Drawing/HeightDrawing.js:254

show

get show(): boolean
Show/hide all points and polylines in the drawing. Middle point is always hidden.

Returns boolean
Overrides Drawing.show
- Defined in src/Core/Drawing/HeightDrawing.js:199
set show(value: boolean): void
Visibility of the drawing (true = points shown).
Parameters
- value: boolean
Returns void
Overrides Drawing.show
- Defined in src/Core/Drawing/HeightDrawing.js:202

Methods

addPoint

addPoint(): void
Add another interactive 3D point to the drawing. Triggers relevant callbacks when placement is complete or limit is reached.

Returns void
Method
Inherited from Drawing.addPoint
- Defined in src/Core/Drawing/Drawing.js:151

cancel

cancel(): boolean
Cancel this drawing (destroys if not already finished).

Returns boolean
True if canceled, false if already finished.
Inherited from Drawing.cancel
- Defined in src/Core/Drawing/Drawing.js:187

destroy

destroy(): null
Destroy all Cesium entities created by this drawing.

Returns null
Overrides Drawing.destroy
- Defined in src/Core/Drawing/HeightDrawing.js:379

differentiate

differentiate(
    lowPoint: Cartesian3,
    middlePoint: Cartesian3,
    highPoint: Cartesian3,
    epsilon?: any,
): [Cartesian3, Cartesian3, Cartesian3]
Utility to ensure all three points are distinct (applies offset if needed).
Parameters
- lowPoint: Cartesian3
- middlePoint: Cartesian3
- highPoint: Cartesian3
- Optionalepsilon: any = ...
Returns [Cartesian3, Cartesian3, Cartesian3]
- Defined in src/Core/Drawing/HeightDrawing.js:181

finish

finish(): void
Manually trigger the finish callback.

Returns void
Inherited from Drawing.finish
- Defined in src/Core/Drawing/Drawing.js:223

onFinish

onFinish(callback: (arg0: Drawing) => void): Drawing
Register a callback for when the drawing is finished. Chainable: returns this.
Parameters
- callback: (arg0: Drawing) => void
  Called when drawing is finished.
Returns Drawing
Inherited from Drawing.onFinish
- Defined in src/Core/Drawing/Drawing.js:213

render

render(): void
Render the three colored polyline segments for the height visualization:
- Low → Middle (yellow, vertical)
- Middle → High (blue, vertical)
- Low → High (green, slanted/height diff)
Returns void
Method
- Defined in src/Core/Drawing/HeightDrawing.js:268

terminate

terminate(): boolean
Mark this drawing as finished/complete. Cleans up interaction handlers and disables cursor.

Returns boolean
Always true when finishing.
Overrides Drawing.terminate
- Defined in src/Core/Drawing/HeightDrawing.js:367

Class HeightDrawing

Param: app

Param: options

Param: options.points

Param: options.pointColor

Param: options.lineColor

Param: options.addPoint

Param: options.onMoveCallback

Param: options.onSetCallback

Param: options.onFinishCallback

Example

Hierarchy (View Summary)

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

Returns HeightDrawing

Properties

app

destroyed

id

line

lines

onFinishCallback

onMoveCallback

onSetCallback

point

pointSet

Accessors

cartesians

Returns Cartesian3[]

Parameters

Returns void

color

Returns Color

Parameters

Returns void

finished

Returns boolean

Parameters

Returns void

lineColor

Returns Color

Parameters

Returns void

maxPoints

Returns number

Parameters

Returns void

pointColor

Returns Color

Parameters

Returns void

points

Returns any[]

show

Returns boolean

Parameters

Returns void

Methods

addPoint

Returns void

Method

cancel

Returns boolean

destroy

Returns null

differentiate

Parameters

Returns [Cartesian3, Cartesian3, Cartesian3]

finish

Returns void

onFinish

Parameters

Returns Drawing

render