代码迁移
This commit is contained in:
69
src/Draw/draw.js
Normal file
69
src/Draw/draw.js
Normal file
@ -0,0 +1,69 @@
|
||||
/**
|
||||
* @name: draw
|
||||
* @author: Administrator
|
||||
* @date: 2022-06-14 16:29
|
||||
* @description：draw
|
||||
* @update: 2022-06-14 16:29
|
||||
*/
|
||||
import Tools from '../Tools'
|
||||
import { get2DView } from '../Global/MultiViewportMode'
|
||||
|
||||
class Draw extends Tools {
|
||||
/**
|
||||
* @constructor
|
||||
* */
|
||||
constructor(sdk, options = {}, is2D = false) {
|
||||
super(sdk, options)
|
||||
this.viewer = sdk.viewer
|
||||
this.entityHasCreated = false
|
||||
this.event = null
|
||||
this.tip = null
|
||||
this.points_ids = []
|
||||
this.color = options.color || 'rgba(185,14,14,0.58)'
|
||||
this._is2D = is2D
|
||||
this._sdk2D = get2DView()
|
||||
}
|
||||
|
||||
create_point(cartesian, viewer = this.viewer) {
|
||||
let id = this.randomString()
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: id,
|
||||
position: cartesian,
|
||||
billboard: {
|
||||
image: this.getSourceRootPath() + '/img/point.png',
|
||||
// verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
color: Cesium.Color.WHITE.withAlpha(0.99)
|
||||
// disableDepthTestDistance: 1000000
|
||||
},
|
||||
})
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
remove_entity(id) {
|
||||
this.viewer.entities.removeById(id)
|
||||
if (!this._is2D && this._sdk2D && this._sdk2D.viewer && this._sdk2D.viewer.entities) {
|
||||
this._sdk2D.viewer.entities.removeById(id)
|
||||
}
|
||||
}
|
||||
|
||||
start() {
|
||||
// this.setPickStatus(false)
|
||||
}
|
||||
|
||||
end() {
|
||||
// this.setPickStatus(true)
|
||||
|
||||
YJ.Measure.SetMeasureStatus(false)
|
||||
this.entityHasCreated = false
|
||||
this.event && this.event.destroy()
|
||||
this.event2D && this.event2D.destroy()
|
||||
this.tip && this.tip.destroy()
|
||||
this.points_ids.forEach((id) => {
|
||||
this.remove_entity(id)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
export default Draw
|
||||
595
src/Draw/drawAssemble.js
Normal file
595
src/Draw/drawAssemble.js
Normal file
@ -0,0 +1,595 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
const transformCartesianToWGS84 = cartesian => {
|
||||
let ellipsoid = Cesium.Ellipsoid.WGS84
|
||||
let cartographic = ellipsoid.cartesianToCartographic(cartesian)
|
||||
const x = Cesium.Math.toDegrees(cartographic.longitude)
|
||||
const y = Cesium.Math.toDegrees(cartographic.latitude)
|
||||
const z = cartographic.height
|
||||
return { x, y, z }
|
||||
}
|
||||
|
||||
/**
|
||||
* @extends Draw*/
|
||||
class DrawAssemble extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @param sdk
|
||||
* @param [options] {object} 面属性
|
||||
* @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
|
||||
|
||||
* */
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
this.points = null
|
||||
this.polygonHasCreated = false
|
||||
}
|
||||
|
||||
static polygon(that, viewer = that.viewer) {
|
||||
let id = that.randomString()
|
||||
return viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
name: 'AssemblePolygon',
|
||||
id,
|
||||
polygon: {
|
||||
hierarchy: new Cesium.CallbackProperty(e => {
|
||||
let arr = that.computeAssemble(that.positions)
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (isNaN(arr[i].x)) {
|
||||
arr = []
|
||||
break
|
||||
}
|
||||
}
|
||||
return new Cesium.PolygonHierarchy(arr)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
outline: true,
|
||||
outlineColor: Cesium.Color.GREEN,
|
||||
zIndex: 99999999
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态绘制面
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawPolygon
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
let that = this
|
||||
// eslint-disable-next-line no-undef
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
// eslint-disable-next-line no-undef
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
let into
|
||||
this.tip = new MouseTip('左键确定，右键取消；', that.sdk)
|
||||
this.event = new MouseEvent(that.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
let cache_84_position = []
|
||||
this.anchorpoints = []
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if (into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
if (!cartesian) return
|
||||
if (this.anchorpoints.length === 3) {
|
||||
this.anchorpoints[1] = cartesian;
|
||||
}
|
||||
else {
|
||||
this.anchorpoints.push(cartesian)
|
||||
}
|
||||
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
if (this.points_ids.length === 3) {
|
||||
let array = [cache_positions[0], cache_positions[2], cache_positions[1]]
|
||||
cb(null, array)
|
||||
this.end()
|
||||
}
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if (into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (!cartesian || this.points_ids.length === 0) return
|
||||
if (cache_positions.length > 1) {
|
||||
this.positions = [cache_positions[0], this.cartesian3Towgs84(cartesian, this.viewer), cache_positions[1]]
|
||||
}
|
||||
else {
|
||||
this.positions = [cache_positions[0], this.cartesian3Towgs84(cartesian, this.viewer)]
|
||||
}
|
||||
if (this.points_ids.length === 1 && !Cesium.defined(this.assemblePolygon)) {
|
||||
this.assemblePolygon = DrawAssemble.polygon(this)
|
||||
}
|
||||
if (this.anchorpoints.length >= 2) {
|
||||
if (this.points_ids.length === 1) {
|
||||
let pnts = new Array();
|
||||
this.positions.forEach((item) => {
|
||||
pnts.push([item.lng, item.lat]);
|
||||
});
|
||||
|
||||
let mid = P.PlotUtils.mid(pnts[0], pnts[1])
|
||||
let d = P.PlotUtils.distance(pnts[0], mid) / 0.9
|
||||
let pnt = P.PlotUtils.getThirdPoint(pnts[0], mid, P.Constants.HALF_PI, d, true)
|
||||
this.positions = [this.positions[0], { lng: pnt[0], lat: pnt[1] }, this.positions[1]];
|
||||
}
|
||||
//替换中间点
|
||||
this.anchorpoints[1] = cartesian;
|
||||
}
|
||||
else {
|
||||
this.anchorpoints.push(cartesian)
|
||||
}
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if (into === '2D') {
|
||||
return
|
||||
}
|
||||
cb(null)
|
||||
this.end()
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if (into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
if (this.anchorpoints.length === 2) {
|
||||
this.anchorpoints.push(cartesian)
|
||||
cb(null, this.positions)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
if (!cartesian || Cesium.defined(this.assemblePolygon)) return
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
this.anchorpoints.push(cartesian)
|
||||
this.assemblePolygon = DrawAssemble.polygon(this)
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if (into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
if (!cartesian) return
|
||||
if (this.anchorpoints.length === 3) {
|
||||
this.anchorpoints[1] = cartesian;
|
||||
}
|
||||
else {
|
||||
this.anchorpoints.push(cartesian)
|
||||
}
|
||||
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
if (this.points_ids.length === 3) {
|
||||
let array = [cache_positions[0], cache_positions[2], cache_positions[1]]
|
||||
cb(null, array)
|
||||
this.end()
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if (into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (!cartesian || this.points_ids.length === 0) return
|
||||
if (cache_positions.length > 1) {
|
||||
this.positions = [cache_positions[0], this.cartesian3Towgs84(cartesian, this.viewer), cache_positions[1]]
|
||||
}
|
||||
else {
|
||||
this.positions = [cache_positions[0], this.cartesian3Towgs84(cartesian, this.viewer)]
|
||||
}
|
||||
if (this.points_ids.length === 1 && !Cesium.defined(this.assemblePolygon)) {
|
||||
this.assemblePolygon = DrawAssemble.polygon(this, this._sdk2D.viewer)
|
||||
}
|
||||
if (this.anchorpoints.length >= 2) {
|
||||
if (this.points_ids.length === 1) {
|
||||
let pnts = new Array();
|
||||
this.positions.forEach((item) => {
|
||||
pnts.push([item.lng, item.lat]);
|
||||
});
|
||||
|
||||
let mid = P.PlotUtils.mid(pnts[0], pnts[1])
|
||||
let d = P.PlotUtils.distance(pnts[0], mid) / 0.9
|
||||
let pnt = P.PlotUtils.getThirdPoint(pnts[0], mid, P.Constants.HALF_PI, d, true)
|
||||
this.positions = [this.positions[0], { lng: pnt[0], lat: pnt[1] }, this.positions[1]];
|
||||
}
|
||||
//替换中间点
|
||||
this.anchorpoints[1] = cartesian;
|
||||
}
|
||||
else {
|
||||
this.anchorpoints.push(cartesian)
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if (into === '3D') {
|
||||
return
|
||||
}
|
||||
cb(null)
|
||||
this.end()
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if (into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
if (this.anchorpoints.length === 2) {
|
||||
this.anchorpoints.push(cartesian)
|
||||
cb(null, this.positions)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
if (!cartesian || Cesium.defined(this.assemblePolygon)) return
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
this.anchorpoints.push(cartesian)
|
||||
this.assemblePolygon = DrawAssemble.polygon(this, this._sdk2D.viewer)
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
end() {
|
||||
super.end();
|
||||
this.viewer.entities.remove(this.assemblePolygon)
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this._sdk2D.viewer.entities.remove(this.assemblePolygon)
|
||||
}
|
||||
}
|
||||
|
||||
// computeAssemblePoints(anchorpoints) {
|
||||
// let points = []
|
||||
|
||||
// let originP = transformCartesianToWGS84(anchorpoints[0])
|
||||
// let lastP = anchorpoints[1]
|
||||
// ? transformCartesianToWGS84(anchorpoints[1])
|
||||
// : { x: originP.x + 0.00001, y: originP.y + 0.00001, z: originP.z }
|
||||
// let vectorOL = { x: lastP.x - originP.x, y: lastP.y - originP.y }
|
||||
// let dOL = Math.sqrt(vectorOL.x * vectorOL.x + vectorOL.y * vectorOL.y)
|
||||
// let v_O_P1_lr = this.calculateVector(
|
||||
// vectorOL,
|
||||
// Math.PI / 3,
|
||||
// (Math.sqrt(3) / 12) * dOL
|
||||
// )
|
||||
// let originP_P1 = v_O_P1_lr[1]
|
||||
// let p1 = { x: originP.x + originP_P1.x, y: originP.y + originP_P1.y }
|
||||
// let p2 = { x: (originP.x + lastP.x) / 2, y: (originP.y + lastP.y) / 2 }
|
||||
// let v_L_P3_lr = this.calculateVector(
|
||||
// vectorOL,
|
||||
// (Math.PI * 2) / 3,
|
||||
// (Math.sqrt(3) / 12) * dOL
|
||||
// )
|
||||
// let lastP_P3 = v_L_P3_lr[1]
|
||||
// let p3 = { x: lastP.x + lastP_P3.x, y: lastP.y + lastP_P3.y }
|
||||
// let v_O_P5_lr = this.calculateVector(vectorOL, Math.PI / 2, (1 / 2) * dOL)
|
||||
// let v_O_P5 = v_O_P5_lr[0]
|
||||
// let p5 = { x: v_O_P5.x + p2.x, y: v_O_P5.y + p2.y }
|
||||
// let p0 = originP
|
||||
// let p4 = lastP
|
||||
// points.push(p0, p1, p2, p3, p4, p5)
|
||||
// const closeCardinal = this.createCloseCardinal(points)
|
||||
// const fb_points = this.calculatePointsFBZ3(closeCardinal, 100)
|
||||
// let result = []
|
||||
// let result2 = []
|
||||
// for (let index = 0; index < fb_points.length; index++) {
|
||||
// const ele = fb_points[index]
|
||||
// let obj = {
|
||||
// lng: ele.x,
|
||||
// lat: ele.y,
|
||||
// alt: 0
|
||||
// }
|
||||
// result.push(ele.x, ele.y, 0)
|
||||
// result2.push(obj)
|
||||
// }
|
||||
// this.position = result2
|
||||
// this.points = result
|
||||
// }
|
||||
|
||||
// computeAssemblePoints2(anchorpoints) {
|
||||
// let points = anchorpoints.length;
|
||||
// if (points < 2) {
|
||||
// return false
|
||||
// } else {
|
||||
// let pnts = new Array();
|
||||
// anchorpoints.forEach((item) => {
|
||||
// let posLonLat = this.cartesian3Towgs84(item, this.viewer);;
|
||||
// pnts.push([posLonLat.lng, posLonLat.lat]);
|
||||
// });
|
||||
// //console.log("pnts6666",pnts);
|
||||
// // pnts.push(tailPoint);
|
||||
// // pnts.push(headerPoint);
|
||||
|
||||
// if (pnts.length === 2) {
|
||||
// let mid = P.PlotUtils.mid(pnts[0], pnts[1])
|
||||
// //let d = utils.MathDistance(pnts[0], mid) / 0.9
|
||||
// let d = P.PlotUtils.distance(pnts[0], mid) / 0.9
|
||||
// //console.log("d",d);
|
||||
// let pnt = P.PlotUtils.getThirdPoint(pnts[0], mid, P.Constants.HALF_PI, d, true)
|
||||
// pnts = [pnts[0], pnt, pnts[1]];
|
||||
// //console.log("pnt",pnt);
|
||||
// //createPoint(Cesium.Cartesian3.fromDegrees(pnt[0], pnt[1]));
|
||||
// }
|
||||
// let mid = P.PlotUtils.mid(pnts[0], pnts[2])
|
||||
// pnts.push(mid, pnts[0], pnts[1])
|
||||
|
||||
// let [normals, pnt1, pnt2, pnt3, result, result2] = [[], undefined, undefined, undefined, [], []]
|
||||
// for (let i = 0; i < pnts.length - 2; i++) {
|
||||
// pnt1 = pnts[i]
|
||||
// pnt2 = pnts[i + 1]
|
||||
// pnt3 = pnts[i + 2]
|
||||
// let normalPoints = P.PlotUtils.getBisectorNormals(0.4, pnt1, pnt2, pnt3)
|
||||
// normals = normals.concat(normalPoints)
|
||||
// }
|
||||
// let count = normals.length
|
||||
// normals = [normals[count - 1]].concat(normals.slice(0, count - 1))
|
||||
// for (let i = 0; i < pnts.length - 2; i++) {
|
||||
// pnt1 = pnts[i]
|
||||
// pnt2 = pnts[i + 1]
|
||||
// result = result.concat([...pnt1, 0])
|
||||
// result2.push(
|
||||
// {
|
||||
// lng: pnt1[0],
|
||||
// lat: pnt1[1],
|
||||
// alt: 0
|
||||
// }
|
||||
// )
|
||||
// for (let t = 0; t <= P.Constants.FITTING_COUNT; t++) {
|
||||
// let pnt = P.PlotUtils.getCubicValue(t / P.Constants.FITTING_COUNT, pnt1, normals[i * 2], normals[i * 2 + 1], pnt2)
|
||||
// result = result.concat([...pnt, 0])
|
||||
// result2.push(
|
||||
// {
|
||||
// lng: pnt[0],
|
||||
// lat: pnt[1],
|
||||
// alt: 0
|
||||
// }
|
||||
// )
|
||||
// }
|
||||
// result = result.concat([...pnt2, 0])
|
||||
// result2.push(
|
||||
// {
|
||||
// lng: pnt2[0],
|
||||
// lat: pnt2[1],
|
||||
// alt: 0
|
||||
// }
|
||||
// )
|
||||
// }
|
||||
// this.position = result2
|
||||
// this.points = result
|
||||
// }
|
||||
// }
|
||||
|
||||
calculateVector(v, theta, d) {
|
||||
if (!theta) theta = Math.PI / 2
|
||||
if (!d) d = 1
|
||||
let x_1
|
||||
let x_2
|
||||
let y_1
|
||||
let y_2
|
||||
let v_l
|
||||
let v_r
|
||||
let d_v = Math.sqrt(v.x * v.x + v.y * v.y)
|
||||
if (v.y == 0) {
|
||||
x_1 = x_2 = (d_v * d * Math.cos(theta)) / v.x
|
||||
if (v.x > 0) {
|
||||
y_1 = Math.sqrt(d * d - x_1 * x_1)
|
||||
y_2 = -y_1
|
||||
} else if (v.x < 0) {
|
||||
y_2 = Math.sqrt(d * d - x_1 * x_1)
|
||||
y_1 = -y_2
|
||||
}
|
||||
v_l = { x: x_1, y: y_1 }
|
||||
v_r = { x: x_2, y: y_2 }
|
||||
} else {
|
||||
let n = -v.x / v.y
|
||||
let m = (d * d_v * Math.cos(theta)) / v.y
|
||||
let a = 1 + n * n
|
||||
let b = 2 * n * m
|
||||
let c = m * m - d * d
|
||||
x_1 = (-b - Math.sqrt(b * b - 4 * a * c)) / (2 * a)
|
||||
x_2 = (-b + Math.sqrt(b * b - 4 * a * c)) / (2 * a)
|
||||
y_1 = n * x_1 + m
|
||||
y_2 = n * x_2 + m
|
||||
if (v.y >= 0) {
|
||||
v_l = { x: x_1, y: y_1 }
|
||||
v_r = { x: x_2, y: y_2 }
|
||||
} else if (v.y < 0) {
|
||||
v_l = { x: x_2, y: y_2 }
|
||||
v_r = { x: x_1, y: y_1 }
|
||||
}
|
||||
}
|
||||
return [v_l, v_r]
|
||||
}
|
||||
|
||||
createCloseCardinal(points) {
|
||||
if (points == null || points.length < 3) {
|
||||
return points
|
||||
}
|
||||
//获取起点，作为终点，以闭合曲线。
|
||||
let lastP = points[0]
|
||||
points.push(lastP)
|
||||
//定义传入的点数组，将在点数组中央（每两个点）插入两个控制点
|
||||
let cPoints = points
|
||||
//包含输入点和控制点的数组
|
||||
let cardinalPoints = []
|
||||
//至少三个点以上
|
||||
//这些都是相关资料测出的经验数值
|
||||
//定义张力系数，取值在0<t<0.5
|
||||
let t = 0.4
|
||||
//为端点张力系数因子，取值在0<b<1
|
||||
// let b = 0.5;
|
||||
//误差控制，是一个大于等于0的数，用于三点非常趋近与一条直线时，减少计算量
|
||||
let e = 0.005
|
||||
//传入的点数量，至少有三个，n至少为2
|
||||
let n = cPoints.length - 1
|
||||
//从开始遍历到倒数第二个，其中倒数第二个用于计算起点（终点）的插值控制点
|
||||
for (let k = 0; k <= n - 1; k++) {
|
||||
let p0, p1, p2
|
||||
//计算起点（终点）的左右控制点
|
||||
if (k == n - 1) {
|
||||
//三个基础输入点
|
||||
p0 = cPoints[n - 1]
|
||||
p1 = cPoints[0]
|
||||
p2 = cPoints[1]
|
||||
} else {
|
||||
p0 = cPoints[k]
|
||||
p1 = cPoints[k + 1]
|
||||
p2 = cPoints[k + 2]
|
||||
}
|
||||
//定义p1的左控制点和右控制点
|
||||
let p1l = { x: undefined, y: undefined }
|
||||
let p1r = { x: undefined, y: undefined }
|
||||
//通过p0、p1、p2计算p1点的做控制点p1l和又控制点p1r
|
||||
//计算向量p0_p1和p1_p2
|
||||
let p0_p1 = { x: p1.x - p0.x, y: p1.y - p0.y }
|
||||
let p1_p2 = { x: p2.x - p1.x, y: p2.y - p1.y }
|
||||
//并计算模
|
||||
let d01 = Math.sqrt(p0_p1.x * p0_p1.x + p0_p1.y * p0_p1.y)
|
||||
let d12 = Math.sqrt(p1_p2.x * p1_p2.x + p1_p2.y * p1_p2.y)
|
||||
//向量单位化
|
||||
let p0_p1_1 = { x: p0_p1.x / d01, y: p0_p1.y / d01 }
|
||||
let p1_p2_1 = { x: p1_p2.x / d12, y: p1_p2.y / d12 }
|
||||
//计算向量p0_p1和p1_p2的夹角平分线向量
|
||||
let p0_p1_p2 = { x: p0_p1_1.x + p1_p2_1.x, y: p0_p1_1.y + p1_p2_1.y }
|
||||
//计算向量 p0_p1_p2 的模
|
||||
let d012 = Math.sqrt(p0_p1_p2.x * p0_p1_p2.x + p0_p1_p2.y * p0_p1_p2.y)
|
||||
//单位化向量p0_p1_p2
|
||||
let p0_p1_p2_1 = { x: p0_p1_p2.x / d012, y: p0_p1_p2.y / d012 }
|
||||
//判断p0、p1、p2是否共线，这里判定向量p0_p1和p1_p2的夹角的余弦和1的差值小于e就认为三点共线
|
||||
let cosE_p0p1p2 = (p0_p1_1.x * p1_p2_1.x + p0_p1_1.y * p1_p2_1.y) / 1
|
||||
//共线
|
||||
if (Math.abs(1 - cosE_p0p1p2) < e) {
|
||||
//计算p1l的坐标
|
||||
p1l.x = p1.x - p1_p2_1.x * d01 * t
|
||||
p1l.y = p1.y - p1_p2_1.y * d01 * t
|
||||
//计算p1r的坐标
|
||||
p1r.x = p1.x + p0_p1_1.x * d12 * t
|
||||
p1r.y = p1.y + p0_p1_1.y * d12 * t
|
||||
}
|
||||
//非共线
|
||||
else {
|
||||
//计算p1l的坐标
|
||||
p1l.x = p1.x - p0_p1_p2_1.x * d01 * t
|
||||
p1l.y = p1.y - p0_p1_p2_1.y * d01 * t
|
||||
//计算p1r的坐标
|
||||
p1r.x = p1.x + p0_p1_p2_1.x * d12 * t
|
||||
p1r.y = p1.y + p0_p1_p2_1.y * d12 * t
|
||||
}
|
||||
//记录起点（终点）的左右插值控制点及倒数第二个控制点
|
||||
if (k == n - 1) {
|
||||
cardinalPoints[0] = p1
|
||||
cardinalPoints[1] = p1r
|
||||
cardinalPoints[(n - 2) * 3 + 2 + 3] = p1l
|
||||
cardinalPoints[(n - 2) * 3 + 2 + 4] = cPoints[n]
|
||||
} else {
|
||||
//记录下这三个控制点
|
||||
cardinalPoints[k * 3 + 2 + 0] = p1l
|
||||
cardinalPoints[k * 3 + 2 + 1] = p1
|
||||
cardinalPoints[k * 3 + 2 + 2] = p1r
|
||||
}
|
||||
}
|
||||
return cardinalPoints
|
||||
}
|
||||
|
||||
calculatePointsFBZ3(points, part) {
|
||||
if (!part) part = 20
|
||||
//获取待拆分的点
|
||||
let bezierPts = []
|
||||
let scale = 0.05
|
||||
if (part > 0) {
|
||||
scale = 1 / part
|
||||
}
|
||||
for (let i = 0; i < points.length - 3;) {
|
||||
//起始点
|
||||
let pointS = points[i]
|
||||
//第一个控制点
|
||||
let pointC1 = points[i + 1]
|
||||
//第二个控制点
|
||||
let pointC2 = points[i + 2]
|
||||
//结束点
|
||||
let pointE = points[i + 3]
|
||||
bezierPts.push(pointS)
|
||||
for (let t = 0; t < 1;) {
|
||||
//三次贝塞尔曲线公式
|
||||
let x =
|
||||
(1 - t) * (1 - t) * (1 - t) * pointS.x +
|
||||
3 * t * (1 - t) * (1 - t) * pointC1.x +
|
||||
3 * t * t * (1 - t) * pointC2.x +
|
||||
t * t * t * pointE.x
|
||||
let y =
|
||||
(1 - t) * (1 - t) * (1 - t) * pointS.y +
|
||||
3 * t * (1 - t) * (1 - t) * pointC1.y +
|
||||
3 * t * t * (1 - t) * pointC2.y +
|
||||
t * t * t * pointE.y
|
||||
let point = { x: x, y: y }
|
||||
bezierPts.push(point)
|
||||
t += scale
|
||||
}
|
||||
i += 3
|
||||
if (i >= points.length) {
|
||||
bezierPts.push(pointS)
|
||||
}
|
||||
}
|
||||
return bezierPts
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawAssemble
|
||||
263
src/Draw/drawAttackArrow.js
Normal file
263
src/Draw/drawAttackArrow.js
Normal file
@ -0,0 +1,263 @@
|
||||
/**
|
||||
* @name: drawAttackArrow
|
||||
* @author: Administrator
|
||||
* @date: 2022-06-15 16:38
|
||||
* @description：drawAttackArrow
|
||||
* @update: 2022-06-15 16:38
|
||||
*/
|
||||
import Draw from './draw'
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
|
||||
export default class DrawAttackArrow extends Draw {
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
}
|
||||
|
||||
static create_arrow_polygon(that, viewer = that.viewer) {
|
||||
that.entityHasCreated = true
|
||||
let id = that.randomString()
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: id,
|
||||
polygon: {
|
||||
classificationType: Cesium.ClassificationType.BOTH,
|
||||
hierarchy: new Cesium.CallbackProperty((e) => {
|
||||
let arr = that.computeAttackArrow(that.positions)
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (isNaN(arr[i].x)) {
|
||||
arr = []
|
||||
break
|
||||
}
|
||||
}
|
||||
return new Cesium.PolygonHierarchy(arr)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
},
|
||||
})
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键结束；CTRL+右键撤销', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
let isMove = false
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawAttackArrow.create_arrow_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
isMove = false
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
if (isMove) {
|
||||
this.positions.pop()
|
||||
}
|
||||
cb(null, this.positions, c)
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
isMove = true
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, this.positions, c)
|
||||
}
|
||||
else {
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawAttackArrow.create_arrow_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawAttackArrow.create_arrow_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
isMove = false
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.event2D.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
if (isMove) {
|
||||
this.positions.pop()
|
||||
}
|
||||
cb(null, this.positions, c)
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
isMove = true
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event2D.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, this.positions, c)
|
||||
}
|
||||
else {
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawAttackArrow.create_arrow_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
271
src/Draw/drawCircle.js
Normal file
271
src/Draw/drawCircle.js
Normal file
@ -0,0 +1,271 @@
|
||||
/**
|
||||
* @name: drawCircle
|
||||
* @author: Administrator
|
||||
* @date: 2022-06-15 14:55
|
||||
* @description：drawCircle
|
||||
* @update: 2022-06-15 14:55
|
||||
*/
|
||||
import Draw from './draw'
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
|
||||
export default class DrawCircle extends Draw {
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
}
|
||||
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键开始，右键取消', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
let clickNum = 0
|
||||
this.circle_id = this.randomString() //圆id
|
||||
let radius_points = []
|
||||
let cache_points = []
|
||||
let radius = 1 //默认半径
|
||||
let positions = []
|
||||
let center = {}
|
||||
let endpoint = null
|
||||
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
if (clickNum === 1) {
|
||||
this.point_id = this.create_point(cartesian)
|
||||
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
positions = this.createCircle(center, 0.01)
|
||||
cache_points.push(cartesian)
|
||||
createCirclePolygon()
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
this.end()
|
||||
cb(null, { center, radius: Number(radius) })
|
||||
}
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (clickNum) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
if (clickNum === 1) {
|
||||
this.point_id = this.create_point(cartesian)
|
||||
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
cache_points.push(cartesian)
|
||||
createCirclePolygon()
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
this.end()
|
||||
cb(null, { center, radius: Number(radius) })
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
if (clickNum === 1) {
|
||||
this.point_id = this.create_point(cartesian, this._sdk2D.viewer)
|
||||
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
positions = this.createCircle(center, 0.01)
|
||||
cache_points.push(cartesian)
|
||||
createCirclePolygon(this._sdk2D.viewer)
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
this.end()
|
||||
cb(null, { center, radius: Number(radius) })
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (clickNum) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
if (clickNum === 1) {
|
||||
this.point_id = this.create_point(cartesian, this._sdk2D.viewer)
|
||||
center = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
cache_points.push(cartesian)
|
||||
createCirclePolygon(this._sdk2D.viewer)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
radius_points = cache_points.concat(cartesian)
|
||||
endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
radius = this.computeDistance([center, endpoint])
|
||||
positions = this.createCircle(center, radius)
|
||||
this.end()
|
||||
cb(null, { center, radius: Number(radius) })
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
let that = this
|
||||
|
||||
function createCirclePolygon(viewer = that.viewer) {
|
||||
let a = viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: that.circle_id,
|
||||
position: new Cesium.CallbackProperty((e) => {
|
||||
if (endpoint) {
|
||||
let c = that.computeMidpoint(center, endpoint)
|
||||
return Cesium.Cartesian3.fromDegrees(c.lng, c.lat, endpoint.alt)
|
||||
} else {
|
||||
return Cesium.Cartesian3()
|
||||
}
|
||||
}, false),
|
||||
label: {
|
||||
text: new Cesium.CallbackProperty((e) => {
|
||||
if (radius > 1000) {
|
||||
return '半径：' + (radius / 1000).toFixed(2) + ' 公里'
|
||||
}
|
||||
return '半径：' + radius + ' 米'
|
||||
}, false),
|
||||
font: '20px Microsoft YaHei',
|
||||
distanceDisplayCondition: 10000000,
|
||||
scale: 1,
|
||||
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
fillColor: Cesium.Color.fromCssColorString('#f5ce0a'),
|
||||
style: Cesium.LabelStyle.FILL_AND_OUTLINE
|
||||
},
|
||||
polygon: {
|
||||
classificationType: Cesium.ClassificationType.BOTH,
|
||||
hierarchy: new Cesium.CallbackProperty((e) => {
|
||||
return new Cesium.PolygonHierarchy(
|
||||
Cesium.Cartesian3.fromDegreesArray(positions)
|
||||
)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
},
|
||||
polyline: {
|
||||
positions: new Cesium.CallbackProperty((e) => {
|
||||
return radius_points
|
||||
}, false),
|
||||
width: 2,
|
||||
material:
|
||||
Cesium.Color.fromCssColorString('#c1c505').withAlpha(0.5),
|
||||
clampToGround: true,
|
||||
zIndex: 99999999
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
end() {
|
||||
this.remove_entity(this.circle_id)
|
||||
this.remove_entity(this.point_id)
|
||||
YJ.Measure.SetMeasureStatus(false)
|
||||
this.tip && this.tip.destroy()
|
||||
this.event && this.event.destroy()
|
||||
this.event2D && this.event2D.destroy()
|
||||
}
|
||||
}
|
||||
244
src/Draw/drawElliptic.js
Normal file
244
src/Draw/drawElliptic.js
Normal file
@ -0,0 +1,244 @@
|
||||
import Draw from './draw'
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
|
||||
export default class DrawElliptic extends Draw {
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
}
|
||||
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
this.entity_ids = []
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键开始，右键取消', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
let clickNum = 0
|
||||
this.elliptic_id = this.randomString() //圆id
|
||||
let radius_points = []
|
||||
let cache_points = []
|
||||
let cache_84_position = []
|
||||
let radius = 1 //默认半径
|
||||
let positions = []
|
||||
let center
|
||||
let semiMinorAxis = 0
|
||||
let semiMajorAxis = 0
|
||||
let endpoint = null
|
||||
let distanceAB = 0
|
||||
let distanceAC = 0
|
||||
let distanceBC = 0
|
||||
let bearing = 0
|
||||
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
cache_points.push(cartesian)
|
||||
if (clickNum === 1) {
|
||||
cache_points = [cartesian, cartesian, cartesian]
|
||||
let pos84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
center = pos84
|
||||
cache_84_position = [pos84, pos84, pos84]
|
||||
|
||||
calculateElliptic()
|
||||
createEllipticPolygon()
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
cache_points[1] = cartesian
|
||||
cache_points[2] = cartesian
|
||||
let pos84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
cache_84_position[1] = pos84
|
||||
cache_84_position[2] = pos84
|
||||
}
|
||||
if (clickNum >= 3) {
|
||||
this.end()
|
||||
cb(null, { center, bearing, semiMajorAxis, semiMinorAxis })
|
||||
}
|
||||
// if (clickNum === 2) {
|
||||
// radius_points = cache_points.concat(cartesian)
|
||||
// endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
// radius = this.computeDistance([center, endpoint])
|
||||
// positions = this.createCircle(center, radius)
|
||||
// this.end()
|
||||
// cb(null, { center, radius: Number(radius) })
|
||||
// }
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
cache_points[clickNum] = cartesian
|
||||
cache_84_position[clickNum] = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
if (clickNum !== 0) {
|
||||
calculateElliptic()
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
this.tip.set_text('再次左键，完成绘制；右键取消')
|
||||
clickNum++
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
cache_points.push(cartesian)
|
||||
if (clickNum === 1) {
|
||||
cache_points = [cartesian, cartesian, cartesian]
|
||||
let pos84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
center = pos84
|
||||
cache_84_position = [pos84, pos84, pos84]
|
||||
|
||||
calculateElliptic()
|
||||
createEllipticPolygon(this._sdk2D.viewer)
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
cache_points[1] = cartesian
|
||||
cache_points[2] = cartesian
|
||||
let pos84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
cache_84_position[1] = pos84
|
||||
cache_84_position[2] = pos84
|
||||
}
|
||||
if (clickNum >= 3) {
|
||||
this.end()
|
||||
cb(null, { center, bearing, semiMajorAxis, semiMinorAxis })
|
||||
}
|
||||
// if (clickNum === 2) {
|
||||
// radius_points = cache_points.concat(cartesian)
|
||||
// endpoint = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
// radius = this.computeDistance([center, endpoint])
|
||||
// positions = this.createCircle(center, radius)
|
||||
// this.end()
|
||||
// cb(null, { center, radius: Number(radius) })
|
||||
// }
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
cache_points[clickNum] = cartesian
|
||||
cache_84_position[clickNum] = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
if (clickNum !== 0) {
|
||||
calculateElliptic()
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
let that = this
|
||||
|
||||
function calculateElliptic() {
|
||||
let pointA = Cesium.Cartesian3.fromDegrees(cache_84_position[0].lng, cache_84_position[0].lat);
|
||||
let pointB = Cesium.Cartesian3.fromDegrees(cache_84_position[1].lng, cache_84_position[1].lat);
|
||||
let pointC = Cesium.Cartesian3.fromDegrees(cache_84_position[2].lng, cache_84_position[2].lat);
|
||||
if (clickNum === 1) {
|
||||
distanceAB = Cesium.Cartesian3.distance(pointA, pointB);
|
||||
semiMajorAxis = distanceAB
|
||||
semiMinorAxis = semiMajorAxis / 2;
|
||||
|
||||
let start = { x: center.lng, y: center.lat }
|
||||
let end = { x: cache_84_position[1].lng, y: cache_84_position[1].lat }
|
||||
|
||||
let rad = Math.PI / 180,
|
||||
lat1 = start.y * rad,
|
||||
lat2 = end.y * rad,
|
||||
lon1 = start.x * rad,
|
||||
lon2 = end.x * rad;
|
||||
const a = Math.sin(lon2 - lon1) * Math.cos(lat2);
|
||||
const b =
|
||||
Math.cos(lat1) * Math.sin(lat2) -
|
||||
Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon2 - lon1);
|
||||
const radians = Math.atan2(a, b)
|
||||
const degrees = radians % (2 * Math.PI);
|
||||
bearing = 450 - ((degrees * 180) / Math.PI < 0
|
||||
? 360 + (degrees * 180) / Math.PI
|
||||
: (degrees * 180) / Math.PI);
|
||||
}
|
||||
if (clickNum === 2) {
|
||||
distanceAC = Cesium.Cartesian3.distance(pointA, pointC);
|
||||
distanceBC = Cesium.Cartesian3.distance(pointB, pointC);
|
||||
|
||||
let point1 = turf.point([cache_84_position[0].lng, cache_84_position[0].lat]);
|
||||
let point2 = turf.point([cache_84_position[1].lng, cache_84_position[1].lat]);
|
||||
let point3 = turf.point([cache_84_position[2].lng, cache_84_position[2].lat]);
|
||||
const bearing1 = turf.rhumbBearing(point1, point2);
|
||||
const bearing2 = turf.rhumbBearing(point2, point3);
|
||||
const angleDiff = Math.abs(bearing1 - bearing2);
|
||||
let finalAngle = angleDiff > 180 ? 360 - angleDiff : angleDiff;
|
||||
finalAngle = 180 - finalAngle
|
||||
|
||||
semiMinorAxis = distanceBC * Math.sin(Cesium.Math.toRadians(finalAngle));
|
||||
}
|
||||
}
|
||||
|
||||
function createEllipticPolygon(viewer = that.viewer) {
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: that.elliptic_id,
|
||||
position: Cesium.Cartesian3.fromDegrees(center.lng, center.lat),
|
||||
ellipse: {
|
||||
semiMinorAxis: new Cesium.CallbackProperty((e) => {
|
||||
return semiMinorAxis
|
||||
}, false),
|
||||
semiMajorAxis: new Cesium.CallbackProperty((e) => {
|
||||
return semiMajorAxis
|
||||
}, false),
|
||||
granularity: Cesium.Math.toRadians(0.1),
|
||||
rotation: new Cesium.CallbackProperty((e) => {
|
||||
return Cesium.Math.toRadians(bearing)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
end() {
|
||||
this.remove_entity(this.elliptic_id)
|
||||
this.points_ids.forEach((id) => {
|
||||
this.remove_entity(id)
|
||||
})
|
||||
YJ.Measure.SetMeasureStatus(false)
|
||||
this.tip && this.tip.destroy()
|
||||
this.event && this.event.destroy()
|
||||
this.event2D && this.event2D.destroy()
|
||||
}
|
||||
}
|
||||
273
src/Draw/drawPincerArrow.js
Normal file
273
src/Draw/drawPincerArrow.js
Normal file
@ -0,0 +1,273 @@
|
||||
/**
|
||||
* @name: drawPincerArrow
|
||||
* @author: Administrator
|
||||
* @date: 2022-06-15 17:12
|
||||
* @description：drawPincerArrow
|
||||
* @update: 2022-06-15 17:12
|
||||
*/
|
||||
import Draw from './draw'
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
|
||||
export default class DrawPincerArrow extends Draw {
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
}
|
||||
|
||||
static create_arrow_polygon(that, viewer = that.viewer) {
|
||||
that.entityHasCreated = true
|
||||
let id = that.randomString()
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: id,
|
||||
polygon: {
|
||||
classificationType: Cesium.ClassificationType.BOTH,
|
||||
hierarchy: new Cesium.CallbackProperty((e) => {
|
||||
let arr = that.computePincerArrow(that.positions)
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (isNaN(arr[i].x)) {
|
||||
arr = []
|
||||
break
|
||||
}
|
||||
}
|
||||
return new Cesium.PolygonHierarchy(arr)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
},
|
||||
})
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键取消；CTRL+右键撤销', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPincerArrow.create_arrow_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
if (cache_positions.length === 5) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, cache_positions, c)
|
||||
}
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb('取消绘制')
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb('取消绘制')
|
||||
}
|
||||
else {
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPincerArrow.create_arrow_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (cache_positions.length === 5) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, cache_positions, c)
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPincerArrow.create_arrow_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
if (cache_positions.length === 5) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.event2D.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, cache_positions, c)
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb('取消绘制')
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event2D.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb('取消绘制')
|
||||
}
|
||||
else {
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPincerArrow.create_arrow_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
this.positions = cache_positions.concat(
|
||||
this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (cache_positions.length === 5) {
|
||||
let c = []
|
||||
if (this.points_ids.length > 2) {
|
||||
let positions = this.event2D.viewer.entities.getById(this.points_ids[0]).polygon.hierarchy.getValue().positions
|
||||
positions.forEach(it => {
|
||||
c.push(this.cartesian3Towgs84(it, this.viewer))
|
||||
})
|
||||
}
|
||||
this.end()
|
||||
cb(null, cache_positions, c)
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
116
src/Draw/drawPoint.js
Normal file
116
src/Draw/drawPoint.js
Normal file
@ -0,0 +1,116 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from "./draw";
|
||||
|
||||
|
||||
class DrawPoint extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @desc 获取坐标点
|
||||
* */
|
||||
constructor(sdk, options = {}, is2D = false) {
|
||||
super(sdk, options, is2D)
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态获取坐标点
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawPoint
|
||||
* @example draw.start((err,position)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
let car = undefined
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键结束；', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
this.end()
|
||||
let p = this.cartesian3Towgs84(car || cartesian, this.viewer)
|
||||
cb(null, p, Cesium)
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
car = cartesian
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
this.end()
|
||||
let p = this.cartesian3Towgs84(car || cartesian, this.viewer)
|
||||
cb(null, p)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
this.end()
|
||||
let p = this.cartesian3Towgs84(car || cartesian, this.viewer)
|
||||
cb(null, p, Cesium)
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
this.end()
|
||||
cb(false)
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
car = cartesian
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
this.end()
|
||||
let p = this.cartesian3Towgs84(car || cartesian, this.viewer)
|
||||
cb(null, p)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
end() {
|
||||
YJ.Measure.SetMeasureStatus(false)
|
||||
this.event && this.event.destroy()
|
||||
this.event2D && this.event2D.destroy()
|
||||
this.tip && this.tip.destroy()
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawPoint
|
||||
276
src/Draw/drawPolygon.js
Normal file
276
src/Draw/drawPolygon.js
Normal file
@ -0,0 +1,276 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
/**
|
||||
* @extends Draw*/
|
||||
class DrawPolygon extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @param [options] {object} 面属性
|
||||
* @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
|
||||
|
||||
* */
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
this.polygonHasCreated = false
|
||||
}
|
||||
|
||||
static create_polygon(that, viewer = that.viewer) {
|
||||
that.polygonHasCreated = true
|
||||
let id = that.randomString()
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: id,
|
||||
polygon: {
|
||||
classificationType: Cesium.ClassificationType.BOTH,
|
||||
hierarchy: new Cesium.CallbackProperty((e) => {
|
||||
return new Cesium.PolygonHierarchy(that.positions)
|
||||
}),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
},
|
||||
polyline: {
|
||||
positions: new Cesium.CallbackProperty((e) => {
|
||||
return that.positions.concat(that.positions[0])
|
||||
}),
|
||||
width: 2,
|
||||
material: Cesium.Color.fromCssColorString('#c1c505').withAlpha(0.5),
|
||||
clampToGround: true,
|
||||
zIndex: 99999999
|
||||
},
|
||||
})
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态绘制面
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawPolygon
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
this.polygonHasCreated = false
|
||||
super.start()
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
let into
|
||||
this.tip = new MouseTip('左键确定，右键结束；CTRL+右键撤销', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
let cache_84_position = []
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
this.positions = cache_positions.concat({ ...cartesian })
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.position.x,
|
||||
movement.position.y
|
||||
)
|
||||
if (!this.polygonHasCreated) {
|
||||
let polyline_id = DrawPolygon.create_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
// console.log(cache_positions)
|
||||
cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
// let positions = []
|
||||
// console.log(cache_positions)
|
||||
// cache_positions.forEach((item) => {
|
||||
// let p = this.cartesian3Towgs84(item)
|
||||
// console.log(item)
|
||||
// positions.push(p)
|
||||
// })
|
||||
cb(null, cache_84_position)
|
||||
this.end()
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat({ ...cartesian })
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
cache_84_position.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
cache_84_position.pop()
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
cb(null, cache_84_position)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (!this.polygonHasCreated) {
|
||||
let polyline_id = DrawPolygon.create_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
// console.log(cache_positions)
|
||||
cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
this.positions = cache_positions.concat({ ...cartesian })
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.position.x + this.viewer.canvas.width,
|
||||
movement.position.y
|
||||
)
|
||||
if (!this.polygonHasCreated) {
|
||||
let polyline_id = DrawPolygon.create_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
// console.log(cache_positions)
|
||||
cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
// let positions = []
|
||||
// console.log(cache_positions)
|
||||
// cache_positions.forEach((item) => {
|
||||
// let p = this.cartesian3Towgs84(item)
|
||||
// console.log(item)
|
||||
// positions.push(p)
|
||||
// })
|
||||
cb(null, cache_84_position)
|
||||
this.end()
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat({ ...cartesian })
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event2D.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
cache_84_position.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
cache_84_position.pop()
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
cb(null, cache_84_position)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (!this.polygonHasCreated) {
|
||||
let polyline_id = DrawPolygon.create_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
// console.log(cache_positions)
|
||||
cache_84_position.push(this.cartesian3Towgs84(cartesian, this.viewer))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawPolygon
|
||||
348
src/Draw/drawPolyline.js
Normal file
348
src/Draw/drawPolyline.js
Normal file
@ -0,0 +1,348 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
/**
|
||||
* @extends Draw
|
||||
*/
|
||||
|
||||
class DrawPolyline extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @param [options] {object} 线属性
|
||||
* @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
|
||||
*
|
||||
* */
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
this.options.curve = options.curve || false
|
||||
let number = Number(options.number)
|
||||
if (!isNaN(number)) {
|
||||
if (number < 2) {
|
||||
this.options.number = 2
|
||||
}
|
||||
else {
|
||||
this.options.number = number
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.options.number = Infinity
|
||||
}
|
||||
}
|
||||
|
||||
static create_polyline(that, viewer = that.viewer) {
|
||||
that.entityHasCreated = true
|
||||
let id = that.randomString()
|
||||
viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
id: id,
|
||||
polyline: {
|
||||
positions: new Cesium.CallbackProperty(() => {
|
||||
if (that.options.curve) {
|
||||
let positions = that.smoothHandle(that.positions)
|
||||
return positions
|
||||
}
|
||||
else {
|
||||
return that.positions
|
||||
}
|
||||
}, false),
|
||||
width: 5,
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
clampToGround: true,
|
||||
zIndex: 99999999
|
||||
}
|
||||
})
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
// 平滑处理
|
||||
smoothHandle(positions) {
|
||||
if (positions.length > 1) {
|
||||
let newPositions = []
|
||||
let time = []
|
||||
for (let i = 0; i < positions.length; i++) {
|
||||
time.push(i / (positions.length - 1))
|
||||
}
|
||||
let spline = new Cesium.CatmullRomSpline({
|
||||
times: time,
|
||||
points: positions
|
||||
});
|
||||
let length = positions.length * 20
|
||||
for (let i = 0; i <= length; i++) {
|
||||
let cartesian3 = spline.evaluate(i / length);
|
||||
newPositions.push(cartesian3);
|
||||
}
|
||||
return newPositions
|
||||
}
|
||||
else {
|
||||
return positions
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态获绘制线
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawPolyline
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键结束；CTRL+右键撤销', this.sdk)
|
||||
this.event = new MouseEvent(this.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
|
||||
let cache_positions = []
|
||||
let car = undefined
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.position.x,
|
||||
movement.position.y
|
||||
)
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPolyline.create_polyline(this, this.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
this.points_ids.push(this.create_point(cartesian, this.viewer))
|
||||
|
||||
if (cache_positions.length >= this.options.number) {
|
||||
let positions = []
|
||||
cache_positions.forEach((item) => {
|
||||
positions.push(this.cartesian3Towgs84(item, this.viewer))
|
||||
})
|
||||
let smoothPos
|
||||
if (this.options.curve) {
|
||||
let pos = this.smoothHandle(cache_positions)
|
||||
smoothPos = []
|
||||
for (let i = 0; i < pos.length; i++) {
|
||||
smoothPos[i] = this.cartesian3Towgs84(pos[i], this.viewer)
|
||||
}
|
||||
}
|
||||
cb(null, positions, smoothPos)
|
||||
this.end()
|
||||
}
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let positions = []
|
||||
cache_positions.forEach((item) => {
|
||||
positions.push(this.cartesian3Towgs84(item, this.viewer))
|
||||
})
|
||||
let smoothPos
|
||||
if (this.options.curve) {
|
||||
let pos = this.smoothHandle(cache_positions)
|
||||
smoothPos = []
|
||||
for (let i = 0; i < pos.length; i++) {
|
||||
smoothPos[i] = this.cartesian3Towgs84(pos[i], this.viewer)
|
||||
}
|
||||
}
|
||||
cb(null, positions, smoothPos)
|
||||
this.end()
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
let positions = []
|
||||
cache_positions.forEach((item) => {
|
||||
positions.push(this.cartesian3Towgs84(item, this.viewer))
|
||||
})
|
||||
let smoothPos
|
||||
if (this.options.curve) {
|
||||
let pos = this.smoothHandle(cache_positions)
|
||||
smoothPos = []
|
||||
for (let i = 0; i < pos.length; i++) {
|
||||
smoothPos[i] = this.cartesian3Towgs84(pos[i], this.viewer)
|
||||
}
|
||||
}
|
||||
cb(null, positions, smoothPos)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPolyline.create_polyline(this, this.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
this.points_ids.push(this.create_point(cartesian, this.viewer))
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.position.x + this.viewer.canvas.width,
|
||||
movement.position.y
|
||||
)
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPolyline.create_polyline(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let positions = []
|
||||
cache_positions.forEach((item) => {
|
||||
positions.push(this.cartesian3Towgs84(item, this.viewer))
|
||||
})
|
||||
let smoothPos
|
||||
if (this.options.curve) {
|
||||
let pos = this.smoothHandle(cache_positions)
|
||||
smoothPos = []
|
||||
for (let i = 0; i < pos.length; i++) {
|
||||
smoothPos[i] = this.cartesian3Towgs84(pos[i], this.viewer)
|
||||
}
|
||||
}
|
||||
cb(null, positions, smoothPos)
|
||||
this.end()
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
})
|
||||
this.event2D.mouse_right_keyboard_ctrl((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start_keyboard_ctrl(() => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
if (this.points_ids.length > 1) {
|
||||
this.remove_entity(this.points_ids.pop()) //移除point
|
||||
cache_positions.pop()
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
let positions = []
|
||||
cache_positions.forEach((item) => {
|
||||
positions.push(this.cartesian3Towgs84(item, this.viewer))
|
||||
})
|
||||
let smoothPos
|
||||
if (this.options.curve) {
|
||||
let pos = this.smoothHandle(cache_positions)
|
||||
smoothPos = []
|
||||
for (let i = 0; i < pos.length; i++) {
|
||||
smoothPos[i] = this.cartesian3Towgs84(pos[i], this.viewer)
|
||||
}
|
||||
}
|
||||
cb(null, positions, smoothPos)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
if (!this.entityHasCreated) {
|
||||
let polyline_id = DrawPolyline.create_polyline(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
}
|
||||
cache_positions.push(cartesian)
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
this.positions = cache_positions.concat(cartesian)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawPolyline
|
||||
278
src/Draw/drawRect.js
Normal file
278
src/Draw/drawRect.js
Normal file
@ -0,0 +1,278 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
/**
|
||||
* @extends Draw*/
|
||||
class DrawRect extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @param [options] {object} 面属性
|
||||
* @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
|
||||
|
||||
* */
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
this.rhumb = options.rhumb
|
||||
this.polygonHasCreated = false
|
||||
this.rect = []
|
||||
this.rectObj = []
|
||||
this.entity = null
|
||||
}
|
||||
|
||||
static create_polygon(that, viewer = that.viewer) {
|
||||
let id = that.randomString()
|
||||
viewer.entities.add(
|
||||
(this.entity = new Cesium.Entity({
|
||||
id: id,
|
||||
polygon: {
|
||||
// classificationType: Cesium.ClassificationType.BOTH,
|
||||
hierarchy: new Cesium.CallbackProperty(e => {
|
||||
return new Cesium.PolygonHierarchy(
|
||||
Cesium.Cartesian3.fromDegreesArray(that.rect)
|
||||
)
|
||||
},false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
arcType: that.rhumb ? Cesium.ArcType.RHUMB : Cesium.ArcType.GEODESIC,
|
||||
zIndex: 99999999
|
||||
}
|
||||
}))
|
||||
)
|
||||
return id
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态绘制面
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawRect
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
let that = this
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键取消', that.sdk)
|
||||
this.event = new MouseEvent(that.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
let cache_84_position = []
|
||||
let cnt = 0
|
||||
let firstPoint = null
|
||||
let secondtPoint = null
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
cnt++
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
|
||||
if (!this.polygonHasCreated) {
|
||||
this.polygonHasCreated = true
|
||||
let polyline_id = DrawRect.create_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
firstPoint = wgs84
|
||||
}
|
||||
|
||||
if (cnt == 2) {
|
||||
secondtPoint = wgs84
|
||||
this.end()
|
||||
cb(null, that.rectObj, [firstPoint, secondtPoint])
|
||||
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb('取消', '')
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (cnt == 1) {
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
this.calrect(firstPoint, wgs84)
|
||||
}
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
cb('取消', '')
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
cnt++
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian)
|
||||
|
||||
if (!this.polygonHasCreated) {
|
||||
this.polygonHasCreated = true
|
||||
let polyline_id = DrawRect.create_polygon(this)
|
||||
this.points_ids.push(polyline_id)
|
||||
firstPoint = wgs84
|
||||
}
|
||||
|
||||
if (cnt == 2) {
|
||||
this.calrect(firstPoint, wgs84)
|
||||
secondtPoint = wgs84
|
||||
this.end()
|
||||
cb(null, that.rectObj, [firstPoint, secondtPoint])
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
cnt++
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
|
||||
if (!this.polygonHasCreated) {
|
||||
this.polygonHasCreated = true
|
||||
let polyline_id = DrawRect.create_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
firstPoint = wgs84
|
||||
}
|
||||
|
||||
if (cnt == 2) {
|
||||
secondtPoint = wgs84
|
||||
this.end()
|
||||
cb(null, that.rectObj, [firstPoint, secondtPoint])
|
||||
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb('取消', '')
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (cnt == 1) {
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
this.calrect(firstPoint, wgs84)
|
||||
}
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
cb('取消', '')
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
((movement.position1.x + movement.position2.x) / 2) + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
cnt++
|
||||
let wgs84 = this.cartesian3Towgs84(cartesian)
|
||||
|
||||
if (!this.polygonHasCreated) {
|
||||
this.polygonHasCreated = true
|
||||
let polyline_id = DrawRect.create_polygon(this, this._sdk2D.viewer)
|
||||
this.points_ids.push(polyline_id)
|
||||
firstPoint = wgs84
|
||||
}
|
||||
|
||||
if (cnt == 2) {
|
||||
this.calrect(firstPoint, wgs84)
|
||||
secondtPoint = wgs84
|
||||
this.end()
|
||||
cb(null, that.rectObj, [firstPoint, secondtPoint])
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
calrect(firstPoint, secondPoint) {
|
||||
let positions = []
|
||||
let arr = []
|
||||
let arr2 = []
|
||||
positions.push(
|
||||
[firstPoint.lng, firstPoint.lat, firstPoint.alt],
|
||||
[secondPoint.lng, secondPoint.lat, secondPoint.alt]
|
||||
)
|
||||
let bboxPolygon
|
||||
if (positions.length === 2) {
|
||||
let line = turf.lineString(positions)
|
||||
let bbox = turf.bbox(line)
|
||||
bboxPolygon = turf.bboxPolygon(bbox)
|
||||
}
|
||||
if (bboxPolygon) {
|
||||
// console.log('bboxPolygon',bboxPolygon.geometry.coordinates[0])
|
||||
bboxPolygon.geometry.coordinates[0].forEach(item => {
|
||||
arr.push(item[0])
|
||||
arr.push(item[1])
|
||||
let obj = {
|
||||
lng: item[0],
|
||||
lat: item[1],
|
||||
alt: firstPoint.alt
|
||||
}
|
||||
arr2.push(obj)
|
||||
})
|
||||
this.rect = [...arr]
|
||||
this.rectObj = [...arr2]
|
||||
this.rectObj.pop()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawRect
|
||||
268
src/Draw/drawSector.js
Normal file
268
src/Draw/drawSector.js
Normal file
@ -0,0 +1,268 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
/**
|
||||
* @extends Draw*/
|
||||
class DrawSector extends Draw {
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态绘制面
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawRect
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
let that = this
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确认，右键取消', that.sdk)
|
||||
this.event = new MouseEvent(that.sdk)
|
||||
this._sector_id = null; //扇形
|
||||
this._positions = []; //活动点
|
||||
this.points_ids = []; //脏数据
|
||||
this._entities_sector = []; //脏数据
|
||||
this._radius = 0; //半径
|
||||
this._startAngle = 0; //起始角度
|
||||
this._endAngle = 0; //结束角度
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
// if(that._positions.length == 3) return
|
||||
|
||||
if (this._positions.length < 3) {
|
||||
this.points_ids.push(this.create_point(cartesian));
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
}
|
||||
else {
|
||||
this.end()
|
||||
cb(null, { center: this._positions[0], radius: this._radius, startAngle: this._startAngle, endAngle: this._endAngle })
|
||||
}
|
||||
if (this._positions.length === 2) {
|
||||
let pointA = Cesium.Cartesian3.fromDegrees(this._positions[0].lng, this._positions[0].lat, this._positions[0].alt);
|
||||
let pointB = cartesian;
|
||||
this._radius = Cesium.Cartesian3.distance(pointA, pointB);
|
||||
}
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (this._positions.length < 2) return;
|
||||
if (this._positions.length == 2) {
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
}
|
||||
if (this._positions.length == 3) {
|
||||
this._positions.pop();
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
if (!Cesium.defined(this._sector_id)) {
|
||||
this._sector_id = this.createsector();
|
||||
this.points_ids.push(this._sector_id);
|
||||
}
|
||||
|
||||
let options = that.calculateAangle(that._positions)
|
||||
that._startAngle = options.angle1;
|
||||
that._endAngle = options.angle2;
|
||||
}
|
||||
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(null)
|
||||
})
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
// if(that._positions.length == 3) return
|
||||
|
||||
if (this._positions.length < 3) {
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer));
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
}
|
||||
else {
|
||||
this.end()
|
||||
cb(null, { center: this._positions[0], radius: this._radius, startAngle: this._startAngle, endAngle: this._endAngle })
|
||||
}
|
||||
if (this._positions.length === 2) {
|
||||
let pointA = Cesium.Cartesian3.fromDegrees(this._positions[0].lng, this._positions[0].lat, this._positions[0].alt);
|
||||
let pointB = cartesian;
|
||||
this._radius = Cesium.Cartesian3.distance(pointA, pointB);
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (this._positions.length < 2) return;
|
||||
if (this._positions.length == 2) {
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
}
|
||||
if (this._positions.length == 3) {
|
||||
this._positions.pop();
|
||||
this._positions.push(this.cartesian3Towgs84(cartesian, this.viewer));
|
||||
if (!Cesium.defined(this._sector_id)) {
|
||||
this._sector_id = this.createsector(this._sdk2D.viewer);
|
||||
this.points_ids.push(this._sector_id);
|
||||
}
|
||||
|
||||
let options = that.calculateAangle(that._positions)
|
||||
that._startAngle = options.angle1;
|
||||
that._endAngle = options.angle2;
|
||||
}
|
||||
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.end()
|
||||
cb(null)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//创建直线扇形
|
||||
createsector(viewer = this.viewer) {
|
||||
// console.log(this._positions)
|
||||
let that = this;
|
||||
let angle
|
||||
let hierarchy = new Cesium.CallbackProperty(
|
||||
() => {
|
||||
let pList = that.calSector(that._positions[0], that._radius, that._startAngle, that._endAngle)
|
||||
return new Cesium.PolygonHierarchy(pList);
|
||||
})
|
||||
// let text = new Cesium.CallbackProperty(
|
||||
// () => {
|
||||
// angle = that._endAngle - that._startAngle
|
||||
// if (angle < 0) {
|
||||
// angle = 360 + angle
|
||||
// }
|
||||
// return angle.toFixed(2) + '°';
|
||||
// })
|
||||
let id = that.randomString()
|
||||
let arrowEntity = viewer.entities.add({
|
||||
id: id,
|
||||
position: Cesium.Cartesian3.fromDegrees(that._positions[0].lng, that._positions[0].lat),
|
||||
// label: {
|
||||
// text,
|
||||
// font: "24px Helvetica",
|
||||
// fillColor: Cesium.Color.SKYBLUE,
|
||||
// outlineColor: Cesium.Color.BLACK,
|
||||
// outlineWidth: 2,
|
||||
// style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||
// pixelOffset: new Cesium.Cartesian2(0, -12),
|
||||
// horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
||||
// verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
// disableDepthTestDistance: Number.POSITIVE_INFINITY
|
||||
// },
|
||||
polygon: {
|
||||
hierarchy,
|
||||
show: true,
|
||||
fill: true,
|
||||
clampToGround: true,
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
zIndex: 99999999
|
||||
}
|
||||
}
|
||||
)
|
||||
that._entities_sector.push(arrowEntity);
|
||||
return id
|
||||
}
|
||||
|
||||
cartesianToLatlng(cartesian) {
|
||||
let latlng = this.viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian);
|
||||
let lat = Cesium.Math.toDegrees(latlng.latitude);
|
||||
let lng = Cesium.Math.toDegrees(latlng.longitude);
|
||||
return [lng, lat];
|
||||
}
|
||||
|
||||
/**
|
||||
* 经纬度坐标转墨卡托坐标
|
||||
*/
|
||||
// 墨卡托坐标系：展开地球，赤道作为x轴，向东为x轴正方，本初子午线作为y轴，向北为y轴正方向。
|
||||
// 数字20037508.34是地球赤道周长的一半：地球半径6378137米，赤道周长2*PI*r = 2 * 20037508.3427892，墨卡托坐标x轴区间[-20037508.3427892,20037508.3427892]
|
||||
lonLatToMercator(Latlng) {
|
||||
let E = Latlng[0];
|
||||
let N = Latlng[1];
|
||||
let x = E * 20037508.34 / 180;
|
||||
let y = Math.log(Math.tan((90 + N) * Math.PI / 360)) / (Math.PI / 180);
|
||||
y = y * 20037508.34 / 180;
|
||||
return [x, y]
|
||||
}
|
||||
|
||||
WebMercator2lonLat(mercator) {
|
||||
let x = mercator[0] / 20037508.34 * 180;
|
||||
let ly = mercator[1] / 20037508.34 * 180;
|
||||
let y = 180 / Math.PI * (2 * Math.atan(Math.exp(ly * Math.PI / 180)) - Math.PI / 2)
|
||||
return [x, y];
|
||||
}
|
||||
|
||||
//计算角度
|
||||
calculateAangle(arr) {
|
||||
function getAangle(start, end) {
|
||||
let rad = Math.PI / 180,
|
||||
lat1 = start.y * rad,
|
||||
lat2 = end.y * rad,
|
||||
lon1 = start.x * rad,
|
||||
lon2 = end.x * rad;
|
||||
const a = Math.sin(lon2 - lon1) * Math.cos(lat2);
|
||||
const b =
|
||||
Math.cos(lat1) * Math.sin(lat2) -
|
||||
Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon2 - lon1);
|
||||
const radians = Math.atan2(a, b)
|
||||
const degrees = radians % (2 * Math.PI);
|
||||
let bearing = 450 - ((degrees * 180) / Math.PI < 0
|
||||
? 360 + (degrees * 180) / Math.PI
|
||||
: (degrees * 180) / Math.PI) - 90;
|
||||
return 360 - (bearing % 360)
|
||||
}
|
||||
|
||||
let center = arr[0]
|
||||
let pos84_1 = arr[1]
|
||||
let pos84_2 = arr[2]
|
||||
|
||||
let start = { x: center.lng, y: center.lat }
|
||||
let end1 = { x: pos84_1.lng, y: pos84_1.lat }
|
||||
let end2 = { x: pos84_2.lng, y: pos84_2.lat }
|
||||
|
||||
let angle1 = getAangle(start, end1)
|
||||
let angle2 = getAangle(start, end2)
|
||||
|
||||
return {
|
||||
angle1,
|
||||
angle2
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawSector
|
||||
262
src/Draw/drawStraightArrow.js
Normal file
262
src/Draw/drawStraightArrow.js
Normal file
@ -0,0 +1,262 @@
|
||||
import MouseTip from '../MouseTip'
|
||||
import MouseEvent from '../Event'
|
||||
import Draw from './draw'
|
||||
|
||||
const transformCartesianToWGS84 = cartesian => {
|
||||
let ellipsoid = Cesium.Ellipsoid.WGS84
|
||||
let cartographic = ellipsoid.cartesianToCartographic(cartesian)
|
||||
const x = Cesium.Math.toDegrees(cartographic.longitude)
|
||||
const y = Cesium.Math.toDegrees(cartographic.latitude)
|
||||
const z = cartographic.height
|
||||
return { x, y, z }
|
||||
}
|
||||
|
||||
/**
|
||||
* @extends Draw*/
|
||||
class DrawStraightArrow extends Draw {
|
||||
/**
|
||||
* @constructor
|
||||
* @param sdk
|
||||
* @param [options] {object} 面属性
|
||||
* @param [options.color=rgba(185,14,14,0.58)] {object} 线属性
|
||||
|
||||
* */
|
||||
constructor(sdk, options = {}) {
|
||||
super(sdk, options)
|
||||
this.points = null
|
||||
this.polygonHasCreated = false
|
||||
}
|
||||
|
||||
static polygon(that, viewer = that.viewer) {
|
||||
let id = that.randomString()
|
||||
return viewer.entities.add(
|
||||
new Cesium.Entity({
|
||||
name: 'ArrowPolygon',
|
||||
id,
|
||||
polygon: {
|
||||
hierarchy: new Cesium.CallbackProperty(e => {
|
||||
let arr = that.computeStraightArrow(that.positions)
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (isNaN(arr[i].x)) {
|
||||
arr = []
|
||||
break
|
||||
}
|
||||
}
|
||||
return new Cesium.PolygonHierarchy(arr)
|
||||
}, false),
|
||||
material: Cesium.Color.fromCssColorString(that.color),
|
||||
outline: true,
|
||||
outlineColor: Cesium.Color.GREEN,
|
||||
zIndex: 99999999
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* @desc 开始动态绘制面
|
||||
* @method start
|
||||
* @param cb {function} 回调函数
|
||||
* @memberOf DrawPolygon
|
||||
* @example draw.start((err,positions)=>{
|
||||
*
|
||||
* })
|
||||
* */
|
||||
start(cb) {
|
||||
let that = this
|
||||
// eslint-disable-next-line no-undef
|
||||
if (YJ.Measure.GetMeasureStatus()) {
|
||||
cb('上一次测量未结束')
|
||||
} else {
|
||||
super.start()
|
||||
// eslint-disable-next-line no-undef
|
||||
let into
|
||||
YJ.Measure.SetMeasureStatus(true)
|
||||
this.tip = new MouseTip('左键确定，右键取消；', that.sdk)
|
||||
this.event = new MouseEvent(that.sdk)
|
||||
this.positions = []
|
||||
this.points_ids = [] //存放左键点击时临时添加的point的id
|
||||
let cache_positions = []
|
||||
let cache_84_position = []
|
||||
this.anchorpoints = []
|
||||
this.event.mouse_left((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
into = '3D'
|
||||
if (!cartesian || this.anchorpoints[0]===cartesian) return
|
||||
this.anchorpoints.push(cartesian)
|
||||
|
||||
let p = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
p.lng = Number(p.lng.toFixed(8))
|
||||
p.lat = Number(p.lat.toFixed(8))
|
||||
if(cache_positions[0] && (p.lng === cache_positions[0].lng && p.lat === cache_positions[0].lat)) return;
|
||||
cache_positions.push(p)
|
||||
this.positions.push(p)
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
if (this.points_ids.length === 2) {
|
||||
let array = [cache_positions[0], cache_positions[1]]
|
||||
cb(null, array)
|
||||
this.end()
|
||||
}
|
||||
})
|
||||
this.event.mouse_move((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (!cartesian || this.points_ids.length === 0) {
|
||||
return
|
||||
}
|
||||
|
||||
let p = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
this.positions = [this.positions[0], p];
|
||||
if (this.points_ids.length === 1 && !Cesium.defined(this.arrowPolygon)) {
|
||||
this.arrowPolygon = DrawStraightArrow.polygon(this)
|
||||
}
|
||||
})
|
||||
this.event.mouse_right((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
cb(null)
|
||||
this.end()
|
||||
})
|
||||
|
||||
this.event.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '2D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
if (this.anchorpoints.length === 2) {
|
||||
this.anchorpoints.push(cartesian)
|
||||
cb(null, this.positions)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
if (!cartesian || Cesium.defined(this.arrowPolygon)) return
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
this.anchorpoints.push(cartesian)
|
||||
this.arrowPolygon = DrawStraightArrow.polygon(this)
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian))
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this.event2D = new MouseEvent(this._sdk2D)
|
||||
this.event2D.mouse_left((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
into = '2D'
|
||||
if (!cartesian || this.anchorpoints[0]===cartesian) return
|
||||
this.anchorpoints.push(cartesian)
|
||||
|
||||
let p = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
p.lng = Number(p.lng.toFixed(8))
|
||||
p.lat = Number(p.lat.toFixed(8))
|
||||
if(cache_positions[0] && (p.lng === cache_positions[0].lng && p.lat === cache_positions[0].lat)) return;
|
||||
cache_positions.push(p)
|
||||
this.positions.push(p)
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
if (this.points_ids.length === 2) {
|
||||
let array = [cache_positions[0], cache_positions[1]]
|
||||
cb(null, array)
|
||||
this.end()
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_move((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
movement.endPosition.x + this.viewer.canvas.width,
|
||||
movement.endPosition.y
|
||||
)
|
||||
if (!cartesian || this.points_ids.length === 0) {
|
||||
return
|
||||
}
|
||||
|
||||
let p = this.cartesian3Towgs84(cartesian, this.viewer)
|
||||
this.positions = [this.positions[0], p];
|
||||
if (this.points_ids.length === 1 && !Cesium.defined(this.arrowPolygon)) {
|
||||
this.arrowPolygon = DrawStraightArrow.polygon(this, this._sdk2D.viewer)
|
||||
}
|
||||
})
|
||||
this.event2D.mouse_right((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
cb(null)
|
||||
this.end()
|
||||
})
|
||||
|
||||
this.event2D.gesture_pinck_start((movement, cartesian) => {
|
||||
if(into === '3D') {
|
||||
return
|
||||
}
|
||||
let startTime = new Date()
|
||||
this.event2D.gesture_pinck_end(() => {
|
||||
let endTime = new Date()
|
||||
if (endTime - startTime >= 500) {
|
||||
this.end()
|
||||
cb(false)
|
||||
}
|
||||
else {
|
||||
if (this.anchorpoints.length === 2) {
|
||||
this.anchorpoints.push(cartesian)
|
||||
cb(null, this.positions)
|
||||
this.end()
|
||||
}
|
||||
else {
|
||||
if (!cartesian || Cesium.defined(this.arrowPolygon)) return
|
||||
this.tip.setPosition(
|
||||
cartesian,
|
||||
(movement.position1.x + movement.position2.x) / 2 + this.viewer.canvas.width,
|
||||
(movement.position1.y + movement.position2.y) / 2
|
||||
)
|
||||
this.anchorpoints.push(cartesian)
|
||||
this.arrowPolygon = DrawStraightArrow.polygon(this, this._sdk2D.viewer)
|
||||
cache_positions.push(this.cartesian3Towgs84(cartesian))
|
||||
// console.log(this.cartesian3Towgs84(cartesian))
|
||||
this.points_ids.push(this.create_point(cartesian, this._sdk2D.viewer))
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
end() {
|
||||
super.end();
|
||||
this.viewer.entities.remove(this.arrowPolygon)
|
||||
if (!this._is2D && this._sdk2D) {
|
||||
this._sdk2D.viewer.entities.remove(this.arrowPolygon)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default DrawStraightArrow
|
||||
Reference in New Issue
Block a user