210 lines
6.5 KiB
JavaScript
210 lines
6.5 KiB
JavaScript
|
/**
|
|||
|
* @name: index
|
|||
|
* @author: Administrator
|
|||
|
* @date: 2023-12-29 10:11
|
|||
|
* @description:index
|
|||
|
* @update: 2023-12-29 10:11
|
|||
|
*/
|
|||
|
import Measure from "../index";
|
|||
|
|
|||
|
class MeasureAngle extends Measure {
|
|||
|
constructor(sdk) {
|
|||
|
super(sdk, { text: "左键开始,右键取消" });
|
|||
|
this.cachePositions = []
|
|||
|
this.positions = []
|
|||
|
this.arcPositions = []
|
|||
|
this.line_id = ""
|
|||
|
this.label_id = ""
|
|||
|
this.arc_id = ""
|
|||
|
this.bearing = 0
|
|||
|
}
|
|||
|
|
|||
|
createPolyline() {
|
|||
|
let that = this
|
|||
|
let id = that.randomString()
|
|||
|
that.viewer.entities.add(new Cesium.Entity({
|
|||
|
id,
|
|||
|
polyline: {
|
|||
|
positions: new Cesium.CallbackProperty(() => {
|
|||
|
return that.positions
|
|||
|
}, false),
|
|||
|
clampToGround: true,
|
|||
|
width: 5,
|
|||
|
material: new Cesium.Color.fromCssColorString(that.options.color || that.defaultColor),
|
|||
|
zIndex: 99999999
|
|||
|
}
|
|||
|
}))
|
|||
|
return id
|
|||
|
}
|
|||
|
|
|||
|
end() {
|
|||
|
super.end();
|
|||
|
}
|
|||
|
|
|||
|
destroy() {
|
|||
|
super.destroy();
|
|||
|
let arr = [this.line_id, this.label_id, this.arc_id]
|
|||
|
arr.forEach(id => {
|
|||
|
if (id)
|
|||
|
this.remove_entity(id)
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
cancel() {
|
|||
|
this.end()
|
|||
|
this.destroy()
|
|||
|
}
|
|||
|
|
|||
|
caculateAngle(points = []) {
|
|||
|
let p1 = this.cartesian3Towgs84(points[0], this.viewer)
|
|||
|
let p2 = this.cartesian3Towgs84(points[1], this.viewer)
|
|||
|
let p3 = this.cartesian3Towgs84(points[2], this.viewer)
|
|||
|
let point1 = turf.point([p1.lng, p1.lat]);
|
|||
|
let point2 = turf.point([p2.lng, p2.lat]);
|
|||
|
let point3 = turf.point([p3.lng, p3.lat]);
|
|||
|
let options = { units: 'kilometers' };
|
|||
|
let distance1 = turf.rhumbDistance(point1, point2, options);
|
|||
|
let distance2 = turf.rhumbDistance(point3, point2, options);
|
|||
|
let distance = distance1
|
|||
|
if (distance1 > distance2) {
|
|||
|
distance = distance2
|
|||
|
}
|
|||
|
|
|||
|
let bearing1 = turf.rhumbBearing(point1, point2)
|
|||
|
let bearing2 = turf.rhumbBearing(point3, point2)
|
|||
|
|
|||
|
let bearing = Math.abs(((bearing1 - bearing2) + 360) % 360)
|
|||
|
if (bearing > 180) {
|
|||
|
this.bearing = 360 - bearing
|
|||
|
} else {
|
|||
|
this.bearing = bearing
|
|||
|
}
|
|||
|
this.bearing = this.bearing.toFixed(2)
|
|||
|
|
|||
|
let b1 = (bearing1 - 180)
|
|||
|
let b2 = (bearing2 - 180)
|
|||
|
let arc = turf.lineArc(point2, (distance / 3), b2, b1);
|
|||
|
if (bearing > 180) {
|
|||
|
arc = turf.lineArc(point2, (distance / 3), b1, b2);
|
|||
|
}
|
|||
|
let arcPos = []
|
|||
|
for (let i = 0; i < arc.geometry.coordinates.length; i++) {
|
|||
|
arcPos.push(Cesium.Cartesian3.fromDegrees(arc.geometry.coordinates[i][0], arc.geometry.coordinates[i][1]))
|
|||
|
}
|
|||
|
this.arcPositions = arcPos
|
|||
|
|
|||
|
// if (bearing1 > 0 && bearing2 > 0) {
|
|||
|
// this.bearing = Math.abs(bearing1 - bearing2).toFixed(1)
|
|||
|
// } else if (bearing1 < 0 && bearing2 < 0) {
|
|||
|
// this.bearing = Math.abs(bearing1 - bearing2).toFixed(1)
|
|||
|
// } else if (bearing1 > 0 && bearing2 < 0) {
|
|||
|
// this.bearing = Math.abs(360 - Math.abs(bearing2) - bearing1).toFixed(1)
|
|||
|
// } else {
|
|||
|
// this.bearing = Math.abs(360 - Math.abs(bearing1) - bearing2).toFixed(1)
|
|||
|
// }
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
start() {
|
|||
|
if (!YJ.Measure.GetMeasureStatus()) {
|
|||
|
super.start();
|
|||
|
|
|||
|
let leftEvent = (movement, car) => {
|
|||
|
if (this.ids.length === 0) {
|
|||
|
//需要创建一个线
|
|||
|
this.line_id = this.createPolyline()
|
|||
|
}
|
|||
|
|
|||
|
this.ids.push(this.create_point(car))
|
|||
|
this.tip.setPosition(car, movement.position.x, movement.position.y)
|
|||
|
this.cachePositions.push(car)
|
|||
|
if (this.cachePositions.length) {
|
|||
|
this.positions = this.cachePositions.concat(car)
|
|||
|
}
|
|||
|
if (this.ids.length === 2) {
|
|||
|
this.label_id = Cesium.createGuid()
|
|||
|
this.arc_id = Cesium.createGuid()
|
|||
|
let p = this.cartesian3Towgs84(car, this.viewer)
|
|||
|
this.sampleHeightMostDetailed([p]).then((res) => {
|
|||
|
let arc = this.viewer.entities.add({
|
|||
|
id: this.arc_id,
|
|||
|
polyline: {
|
|||
|
positions: new Cesium.CallbackProperty(() => {
|
|||
|
return this.arcPositions
|
|||
|
}, false),
|
|||
|
clampToGround: true,
|
|||
|
width: 5,
|
|||
|
material: new Cesium.Color.fromCssColorString(this.options.color || this.defaultColor),
|
|||
|
zIndex: 99999999
|
|||
|
}
|
|||
|
})
|
|||
|
let label = this.viewer.entities.add({
|
|||
|
id: this.label_id,
|
|||
|
position: Cesium.Cartesian3.fromDegrees(p.lng, p.lat, (res[0].height || 0) + 0.1),
|
|||
|
label: {
|
|||
|
text: new Cesium.CallbackProperty(() => {
|
|||
|
return "夹角:" + this.bearing + "°"
|
|||
|
}, false),
|
|||
|
font: '20px Microsoft YaHei',
|
|||
|
fillColor: Cesium.Color.fromCssColorString('#f1e605'),
|
|||
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
|||
|
//标注的遮挡距离设置为100则视角与标注的距离大于100米时会有遮挡
|
|||
|
// distanceDisplayCondition: this.distanceDisplayCondition,
|
|||
|
scale: 1,
|
|||
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
|||
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
|||
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|||
|
}
|
|||
|
})
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
if (this.ids.length === 3) {
|
|||
|
this.caculateAngle([this.positions[0], this.positions[1], this.positions[2]])
|
|||
|
//需要停止绘制
|
|||
|
this.end()
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
this.event.mouse_left(leftEvent)
|
|||
|
this.event.mouse_move((movement, car) => {
|
|||
|
this.tip.setPosition(car, movement.endPosition.x, movement.endPosition.y)
|
|||
|
if (this.cachePositions.length) {
|
|||
|
this.positions = this.cachePositions.concat(car)
|
|||
|
}
|
|||
|
if (this.positions.length > 2) {
|
|||
|
//需要开始计算夹角
|
|||
|
this.caculateAngle([this.positions[0], this.positions[1], this.positions[2]])
|
|||
|
}
|
|||
|
})
|
|||
|
this.event.mouse_right((movement, car) => {
|
|||
|
this.cancel()
|
|||
|
})
|
|||
|
|
|||
|
this.event.gesture_pinck_start((movement, cartesian) => {
|
|||
|
let startTime = new Date()
|
|||
|
let pos = {
|
|||
|
position: {
|
|||
|
x: (movement.position1.x + movement.position2.x) / 2,
|
|||
|
y: (movement.position1.y + movement.position2.y) / 2
|
|||
|
}
|
|||
|
}
|
|||
|
this.event.gesture_pinck_end(() => {
|
|||
|
let endTime = new Date()
|
|||
|
if (endTime - startTime >= 500) {
|
|||
|
// 长按取消
|
|||
|
this.cancel()
|
|||
|
}
|
|||
|
else {
|
|||
|
leftEvent(pos, cartesian)
|
|||
|
}
|
|||
|
})
|
|||
|
})
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
export default MeasureAngle
|