Azimuth Measurement
DMap3D.measurement.azimuth is used to measure the azimuth angle between two points in 3D space (the clockwise angle from true north).
Import
import DMap3D from 'dmap3d'
import * as Cesium from 'cesium'
Basic Usage
const viewer = new Cesium.Viewer('cesiumContainer')
// Create azimuth measurement tool
const azimuthTool = new DMap3D.measurement.azimuth(viewer)
// Start measurement (left-click two points: start and end)
azimuthTool.start()
// Azimuth value displayed in real-time, format: Azimuth: XX°
Constructor
new DMap3D.measurement.azimuth(viewer)
Create an azimuth measurement tool instance. Inherits from MeasureBase base class.
Parameters:
viewer- Cesium.Viewer instance
Methods
start()
Start azimuth measurement. The user left-clicks two points (start and end points), and the azimuth is displayed in real-time at the midpoint of the line segment. A true north indicator arrow is also displayed.
azimuthTool.start()
end()
End measurement, keeping the drawn results.
azimuthTool.end()
clear()
Clear all measurement results.
azimuthTool.clear()
destroy()
Destroy the tool and release resources.
azimuthTool.destroy()
updateConfig(config)
Dynamically update style configuration.
azimuthTool.updateConfig({
pointColor: '#FF0000', // Measurement point color
pointSize: 10, // Measurement point size (pixels)
lineColor: '#00FF00', // Measurement line color
lineWidth: 3, // Measurement line width (pixels)
fontColor: '#FFFF00', // Azimuth label text color
fontSize: 16, // Font size (pixels)
arrowColor: '#FF00FF', // True north indicator arrow color
arrowLength: 30 // True north indicator arrow length (meters)
})
Configuration Options
| Property | Type | Default | Description |
|---|---|---|---|
pointColor | string | '#ffc403' | Measurement point color |
pointSize | number | 8 | Measurement point size (pixels) |
lineColor | string | '#12e184' | Measurement line color |
lineWidth | number | 2 | Measurement line width (pixels) |
fontColor | string | '#ffc403' | Azimuth label text color |
fontSize | number | 14 | Font size (pixels) |
arrowColor | string | '#ffc403' | True north indicator arrow color |
arrowLength | number | 20 | True north indicator arrow length (meters) |
Azimuth Reference
Azimuth is calculated based on the ENU (East-North-Up) local coordinate system:
- 0°: True north
- 90°: True east
- 180°: True south
- 270°: True west
- Range:
0° - 360°, clockwise is positive
Complete Example
const viewer = new Cesium.Viewer('cesiumContainer')
// Create azimuth measurement tool
const azimuthTool = new DMap3D.measurement.azimuth(viewer)
// Custom styles
azimuthTool.updateConfig({
pointColor: '#FF0000',
lineColor: '#00FFFF',
fontColor: '#FFFF00',
arrowColor: '#FF0000',
arrowLength: 50,
fontSize: 16
})
// Start measurement
azimuthTool.start()
// Left-click two points, azimuth is calculated and displayed automatically
// A true north indicator line is also shown at the start point
// Clear and remeasure
azimuthTool.clear()
azimuthTool.start()
// Destroy
azimuthTool.destroy()