import * as turf from '@turf/turf';
|
import store from '../../../store';
|
var drawGrid = {
|
id: "Rectangle",
|
drawRect: function () {
|
this.handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
|
var points = [];
|
var shape = this.renderRect(points);
|
var step = 0;
|
var $this = this;
|
|
this.handler.setInputAction(function (e) {
|
var cartesian = viewer.scene.pickPosition(e.position);
|
if (!Cesium.defined(cartesian)) {
|
var ray = viewer.camera.getPickRay(e.position);
|
cartesian = viewer.scene.globe.pick(ray, viewer.scene);
|
}
|
points[step] = cartesian;
|
step++;
|
if (step === 3) {
|
$this.handler.destroy();
|
store.state.isshowGrid= true
|
}
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
this.handler.setInputAction(function (e) {
|
var cartesian = viewer.scene.pickPosition(e.startPosition);
|
if (!Cesium.defined(cartesian)) {
|
var ray = viewer.camera.getPickRay(e.startPosition);
|
cartesian = viewer.scene.globe.pick(ray, viewer.scene);
|
}
|
points[2] = cartesian;
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
},
|
renderRect: function (points) {
|
var shape = viewer.entities.add({
|
id: this.id,
|
polygon: {
|
hierarchy: new Cesium.CallbackProperty(function () {
|
if (points[0] && points[1] && points[2]) {
|
var r0 = Cesium.Cartographic.fromCartesian(points[0]);
|
var r1 = Cesium.Cartographic.fromCartesian(points[1]); // 辅助点
|
var r2 = Cesium.Cartographic.fromCartesian(points[2]);
|
|
var p0 = turf.point([
|
(r0.longitude * 180) / Math.PI,
|
(r0.latitude * 180) / Math.PI
|
]);
|
var p1 = turf.point([
|
(r1.longitude * 180) / Math.PI,
|
(r1.latitude * 180) / Math.PI
|
]);
|
var p2 = turf.point([
|
(r2.longitude * 180) / Math.PI,
|
(r2.latitude * 180) / Math.PI
|
]);
|
|
this.rectanglePoint = p1;
|
var bearing1 = turf.rhumbBearing(p0, p1);
|
var bearing2 = turf.rhumbBearing(p0, p2);
|
var angle1 = bearing2 - bearing1;
|
|
// 对角长度
|
var length = turf.distance(p0, p2, { units: "meters" });
|
|
var len1 = Math.cos((angle1 / 180) * Math.PI) * length;
|
var dest1 = turf.destination(p0, len1, bearing1, { units: "meters" });
|
|
var angle2 = 90 - angle1;
|
var len2 = Math.cos((angle2 / 180) * Math.PI) * length;
|
var dest2 = turf.destination(p0, len2, 90 + bearing1, {
|
units: "meters",
|
});
|
|
var coordinates = [
|
points[0],
|
Cesium.Cartesian3.fromDegrees(dest1.geometry.coordinates[0], dest1.geometry.coordinates[1]),
|
points[2],
|
Cesium.Cartesian3.fromDegrees(dest2.geometry.coordinates[0], dest2.geometry.coordinates[1])
|
];
|
return new Cesium.PolygonHierarchy(coordinates);
|
}
|
}, false),
|
material: Cesium.Color.CYAN.withAlpha(0.5),
|
outline: true,
|
outlineColor: Cesium.Color.BLACK,
|
},
|
});
|
|
return shape;
|
},
|
drawPoint: function ( res) {
|
var rect = viewer.entities.getById(this.id);
|
if (!rect) return;
|
|
var points = rect.polygon.hierarchy.getValue().positions;
|
//var r0 = Cesium.Cartographic.fromCartesian(points[0]);
|
//var r1 = Cesium.Cartographic.fromCartesian(points[1]);
|
//var r2 = Cesium.Cartographic.fromCartesian(points[2]);
|
|
var r0 = Cesium.Cartographic.fromCartesian(points[0]);
|
var r1 = Cesium.Cartographic.fromCartesian(points[1]);
|
var r2 = Cesium.Cartographic.fromCartesian(points[2]);
|
|
var p0 = turf.point([(r0.longitude * 180) / Math.PI, (r0.latitude * 180) / Math.PI]);
|
var p1 = turf.point([(r1.longitude * 180) / Math.PI, (r1.latitude * 180) / Math.PI]);
|
var p2 = turf.point([(r2.longitude * 180) / Math.PI, (r2.latitude * 180) / Math.PI]);
|
|
// 做成 3 * 4 的网格
|
var wCount =res.col, hCount = res.row;
|
|
var wStep = turf.distance(p0, p1, { units: "meters" }) / (wCount - 1);
|
var hStep = turf.distance(p1, p2, { units: "meters" }) / (hCount - 1);
|
|
var wAngle = turf.bearing(p0, p1);
|
var hAngle = turf.bearing(p1, p2);
|
var op = { units: "meters", };
|
|
var arr = [p0.geometry.coordinates];
|
|
// for (var i = 1; i < wCount; i++) {
|
// var dest = turf.destination(p0, wStep * i, wAngle, op);
|
// arr.push(dest.geometry.coordinates);
|
// }
|
|
// for (var i = 0; i < wCount; i++) {
|
// var p = arr[i];
|
// for (var j = 1; j < hCount; j++) {
|
// var dest = turf.destination(p, hStep * j, hAngle, op);
|
// arr.push(dest.geometry.coordinates);
|
// }
|
// }
|
|
// 显示点
|
// for (var i = 0; i < arr.length; i++) {
|
// var p = arr[i];
|
// console.log(arr[i])
|
// viewer.entities.add({
|
// name: "点",
|
// show: true,
|
// position: Cesium.Cartesian3.fromDegrees(p[0], p[1], 0),
|
// point: {
|
// color: Cesium.Color.RED,
|
// pixelSize: 5,
|
// heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
// // 无论如何缩放，标记点不被地形遮挡
|
// disableDepthTestDistance: Number.POSITIVE_INFINITY
|
// }
|
// });
|
// }
|
},
|
setGridRowCol:function(res){
|
|
store.state.isshowGrid= false;
|
|
this.drawPoint(res);
|
|
},
|
};
|
export default drawGrid
|
