pickFromRay射线碰撞监测

ran125 · May 14, 2019 · 425257e · 425257e
1 parent 309d8d1
commit 425257e
Showing 1 changed file with 199 additions and 0 deletions.
diff --git a/App/可视域分析.html b/App/可视域分析.html
@@ -0,0 +1,199 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
+    <meta name="viewport"
+          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+    <title>可视域分析</title>
+    <!--<link rel="stylesheet" href="../lib/Cesium-1.51/Build/Cesium/Widgets/widgets.css">-->
+    <!--<script src="../lib/Cesium-1.51/Build/Cesium/Cesium.js"></script>-->
+    <link rel="stylesheet" href="http://localhost:90/cesium1.57/Build/Cesium/Widgets/widgets.css">
+    <script src="http://localhost:90/cesium1.57/Build/Cesium/Cesium.js"></script>
+    <style>
+        html,
+        body,
+        #cesiumContainer {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+            overflow: hidden;
+            background-color: #000000;
+        }
+
+    </style>
+
+</head>
+
+<body>
+<div id="cesiumContainer">
+</div>
+<script>
+
+    Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIwMDVjODczYy1kMzkxLTQ1OGUtYjAwOS01MDRlN2QzOTExYTgiLCJpZCI6NTM3Mywic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU0MzE5NzM1NH0.RqX0BJWiIngpnINQpX5S7-4Gb16v85X2PPl6DfnGvCw';
+
+    // 初始化容器
+    var viewer = new Cesium.Viewer('cesiumContainer', {
+        imageryProvider: new Cesium.UrlTemplateImageryProvider({
+            url: 'http://www.google.cn/maps/vt?lyrs=s@716&x={x}&y={y}&z={z}'
+        })
+    });
+
+    // 开启地形深度监测
+    viewer.scene.globe.depthTestAgainstTerrain = true;
+
+    // 加载3dtile模型
+    var tileset = new Cesium.Cesium3DTileset({
+        url: 'http://localhost:90/fhsq/tileset.json',
+        // show: false
+    });
+    viewer.scene.primitives.add(tileset);
+    tileset.readyPromise.then(function (argument) {
+        // 更改相机状态
+        viewer.camera.flyToBoundingSphere(tileset.boundingSphere);
+    });
+
+    // entity集合
+    var parentEntity = viewer.entities.add(new Cesium.Entity());
+
+    // 视域点
+    var viewPoint = Cesium.Cartesian3.fromDegrees(114.46430512179235, 30.436947239947525, 100);
+
+    var viewPointEntity = viewer.entities.add({
+        parent: parentEntity,
+        position: viewPoint,
+        ellipsoid: {
+            radii: new Cesium.Cartesian3(5, 5, 5),
+            material: Cesium.Color.GREEN
+        }
+    });
+
+    // 加载坐标轴,便于测试
+    var transform = Cesium.Transforms.eastNorthUpToFixedFrame(viewPoint);
+    var modelMatrixPrimitive = viewer.scene.primitives.add(new Cesium.DebugModelMatrixPrimitive({
+        modelMatrix: transform,
+        length: 1000.0
+    }));
+
+    // 世界坐标转换为投影坐标
+    var webMercatorProjection = new Cesium.WebMercatorProjection(viewer.scene.globe.ellipsoid);
+    var viewPointWebMercator = webMercatorProjection.project(Cesium.Cartographic.fromCartesian(viewPoint));
+
+    // 排除碰撞监测的对象
+    var objectsToExclude = [viewPointEntity, modelMatrixPrimitive];
+
+    // 目标点集合
+    var destPoints = [];
+
+    // 视域点和目标点的距离
+    var radius = 1000; // 视距1000米
+
+    // 计算45°和135°之间的目标点
+    for (var i = 45; i <= 135; i++) {
+        // 度数转弧度
+        var radians = Cesium.Math.toRadians(i);
+        // 计算目标点
+        var toPoint = new Cesium.Cartesian3(viewPointWebMercator.x + radius * Math.cos(radians), viewPointWebMercator.y + radius * Math.sin(radians), 30);
+        // 投影坐标转世界坐标
+        toPoint = webMercatorProjection.unproject(toPoint);
+        destPoints.push(Cesium.Cartographic.toCartesian(toPoint.clone()));
+
+        // 添加排除的辅助对象
+        objectsToExclude.push(viewer.entities.add({
+            parent: parentEntity,
+            name: i,
+            position: Cesium.Cartesian3.fromDegrees(Cesium.Math.toDegrees(toPoint.longitude), Cesium.Math.toDegrees(toPoint.latitude), 30),
+            ellipsoid: {
+                radii: new Cesium.Cartesian3(5, 5, 5),
+                material: Cesium.Color.RED
+            }
+        }));
+    }
+
+    // 绘制线
+    function drawLine(leftPoint, secPoint, color) {
+        viewer.entities.add({
+            polyline: {
+                positions: [leftPoint, secPoint],
+                arcType: Cesium.ArcType.NONE,
+                width: 5,
+                material: color,
+                depthFailMaterial: color
+            }
+        })
+    }
+
+    function pickFromRay() {
+        for (var i = 0; i < destPoints.length; i++) {
+            // 计算射线的方向，目标点left 视域点right
+            var direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(destPoints[i], viewPoint, new Cesium.Cartesian3()), new Cesium.Cartesian3());
+            // 建立射线
+            var ray = new Cesium.Ray(viewPoint, direction);
+            // var results = viewer.scene.drillPickFromRay(ray, 10, objectsToExclude); // 计算所有的交互点，最大不超过10个
+            // if (Cesium.defined(results) && results.length > 0) {
+            //     showIntersection(results[0]);
+            // }
+            var result = viewer.scene.pickFromRay(ray, objectsToExclude); // 计算交互点，返回第一个
+            showIntersection(result, destPoints[i], viewPoint);
+        }
+    }
+
+    // 处理交互点
+    function showIntersection(result, destPoint, viewPoint) {
+        // 如果是场景模型的交互点，排除交互点是地球表面
+        if (Cesium.defined(result) && Cesium.defined(result.object)) {
+            drawLine(result.position, viewPoint, Cesium.Color.GREEN); // 可视区域
+            drawLine(result.position, destPoint, Cesium.Color.RED); // 不可视区域
+        } else {
+            drawLine(viewPoint, destPoint, Cesium.Color.GREEN);
+        }
+    }
+
+    /**
+     * Returns an object containing the first object intersected by the ray and the position of intersection,
+     * or <code>undefined</code> if there were no intersections. The intersected object has a <code>primitive</code>
+     * property that contains the intersected primitive. Other properties may be set depending on the type of primitive
+     * and may be used to further identify the picked object. The ray must be given in world coordinates.
+     * <p>
+     * This function only picks globe tiles and 3D Tiles that are rendered in the current view. Picks all other
+     * primitives regardless of their visibility.
+     * </p>
+     *
+     * @private
+     *
+     * @param {Ray} ray The ray.
+     * @param {Object[]} [objectsToExclude] A list of primitives, entities, or features to exclude from the ray intersection.
+     * @returns {Object} An object containing the object and position of the first intersection.
+     *
+     * @exception {DeveloperError} Ray intersections are only supported in 3D mode.
+     */
+    // Scene.prototype.pickFromRay = function(ray, objectsToExclude) {
+
+
+    /**
+     * Returns a list of objects, each containing the object intersected by the ray and the position of intersection.
+     * The intersected object has a <code>primitive</code> property that contains the intersected primitive. Other
+     * properties may also be set depending on the type of primitive and may be used to further identify the picked object.
+     * The primitives in the list are ordered by first intersection to last intersection. The ray must be given in
+     * world coordinates.
+     * <p>
+     * This function only picks globe tiles and 3D Tiles that are rendered in the current view. Picks all other
+     * primitives regardless of their visibility.
+     * </p>
+     *
+     * @private
+     *
+     * @param {Ray} ray The ray.
+     * @param {Number} [limit=Number.MAX_VALUE] If supplied, stop finding intersections after this many intersections.
+     * @param {Object[]} [objectsToExclude] A list of primitives, entities, or features to exclude from the ray intersection.
+     * @returns {Object[]} List of objects containing the object and position of each intersection.
+     *
+     * @exception {DeveloperError} Ray intersections are only supported in 3D mode.
+     */
+    //Scene.prototype.drillPickFromRay = function(ray, limit, objectsToExclude) {
+
+</script>
+</body>
+
+</html>