cesium-plot-js/src/draw.ts

93 lines
3.1 KiB
TypeScript
Raw Normal View History

2023-08-09 09:55:29 +00:00
import * as Utils from './utils';
import * as CesiumTypeOnly from '../examples/cesium';
2023-08-09 09:55:29 +00:00
export default class Draw {
cesium: typeof CesiumTypeOnly;
viewer: CesiumTypeOnly.Viewer;
2023-08-09 09:55:29 +00:00
arrowLengthScale: number = 5;
maxArrowLength: number = 2;
tailWidthFactor: number;
neckWidthFactor: number;
headWidthFactor: number;
headAngle: number;
neckAngle: number;
eventHandler: CesiumTypeOnly.ScreenSpaceEventHandler;
entity: CesiumTypeOnly.Entity;
geometryPoints: CesiumTypeOnly.Cartesian3[] | undefined;
2023-08-09 09:55:29 +00:00
constructor(cesium: typeof CesiumTypeOnly, viewer: CesiumTypeOnly.Viewer) {
2023-08-09 09:55:29 +00:00
this.cesium = cesium;
this.viewer = viewer;
this.tailWidthFactor = 0.1;
this.neckWidthFactor = 0.2;
this.headWidthFactor = 0.25;
this.headAngle = Math.PI / 8.5;
this.neckAngle = Math.PI / 13;
this.cartesianToLnglat = this.cartesianToLnglat.bind(this);
this.pixelToCartesian = this.pixelToCartesian.bind(this);
2023-08-09 09:55:29 +00:00
}
2023-08-10 02:23:56 +00:00
onClick() {
2023-08-09 09:55:29 +00:00
this.eventHandler = new this.cesium.ScreenSpaceEventHandler(this.viewer.canvas);
this.eventHandler.setInputAction((evt) => {
2023-08-10 02:23:56 +00:00
const cartesian = this.pixelToCartesian(evt.position);
this.addPoint(cartesian);
2023-08-09 09:55:29 +00:00
}, this.cesium.ScreenSpaceEventType.LEFT_CLICK);
}
2023-08-10 02:23:56 +00:00
onMouseMove() {
this.eventHandler.setInputAction((evt) => {
const cartesian = this.pixelToCartesian(evt.endPosition);
const lnglat = this.cartesianToLnglat(cartesian);
const lastPoint = this.cartesianToLnglat(this.points[this.points.length - 1]);
const distance = Utils.MathDistance(lnglat, lastPoint);
if (distance < 0.0001) {
return false;
}
// Synchronize data to subclasses.
2023-08-10 02:23:56 +00:00
this.updateMovingPoint(cartesian);
}, this.cesium.ScreenSpaceEventType.MOUSE_MOVE);
}
removeClickListener() {
this.eventHandler.removeInputAction(this.cesium.ScreenSpaceEventType.LEFT_CLICK);
}
removeMoveListener() {
this.eventHandler.removeInputAction(this.cesium.ScreenSpaceEventType.MOUSE_MOVE);
}
setGeometryPoints(geometryPoints: CesiumTypeOnly.Cartesian3[]) {
2023-08-10 02:23:56 +00:00
this.geometryPoints = geometryPoints;
}
addToMap() {
2023-08-09 09:55:29 +00:00
const callback = () => {
2023-08-10 02:23:56 +00:00
return new this.cesium.PolygonHierarchy(this.geometryPoints);
2023-08-09 09:55:29 +00:00
};
2023-08-10 02:23:56 +00:00
if (!this.entity) {
this.entity = this.viewer.entities.add({
polygon: new this.cesium.PolygonGraphics({
hierarchy: new this.cesium.CallbackProperty(callback, false),
show: true,
// fill: true,
// material: this.cesium.Color.LIGHTSKYBLUE.withAlpha(0.8),
}),
});
}
2023-08-09 09:55:29 +00:00
}
cartesianToLnglat(cartesian: CesiumTypeOnly.Cartesian3): number[] {
const lnglat = this.viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian);
const lat = this.cesium.Math.toDegrees(lnglat.latitude);
const lng = this.cesium.Math.toDegrees(lnglat.longitude);
2023-08-09 09:55:29 +00:00
return [lng, lat];
}
2023-08-10 02:23:56 +00:00
pixelToCartesian(position: CesiumTypeOnly.Cartesian2): CesiumTypeOnly.Cartesian3 | undefined {
2023-08-10 02:23:56 +00:00
const ray = this.viewer.camera.getPickRay(position);
const cartesian = this.viewer.scene.globe.pick(ray, this.viewer.scene);
return cartesian;
}
2023-08-09 09:55:29 +00:00
}