低代码判断两个模型当前是否发生碰撞

1. /** 说明：创建App，url为园区地址（可选）
   
2. *       使用App创建打开的三维空间我们称之为“场景”（scene）。场景包含地球、园区、模型等。
   
3. *       创建App时，传入的url就是园区的地址，不传url则创建一个空的场景。园区可在CampusBuilder
   
4. *       中创建编辑，有两种方法可以将园区添加到线上资源面板，方法如下：
   
5. *          1. 园区保存后，会自动同步到网页同一账号下
   
6. *          2. 园区保存后，导出tjs文件，在园区资源面板上传
   
7. *      上面两种方式生成的园区资源均可在资源面板中双击自动生成脚本
   
8. *  难度：★☆☆☆☆
   
9. **/
   
10. 
    
11. // 加载场景代码
    
12. var app = new THING.App({
    
13.     url: 'https://www.thingjs.com/static/models/factory',  // 场景地址
    
14.     background: '#000000',
    
15.     env: 'Seaside',
    
16. });
    
17. app.on('load', function (ev) {
    
18.     app.level.change(ev.campus)
    
19.     let car01 = app.query('car01')[0]
    
20.     let car02 = app.query('car02')[0]
    
21. 
    
22. 
    
23.     car01.style.boundingBox = true
    
24.     car02.style.boundingBox = true
    
25.     // crash(car01, car02)
    
26.     car02.draggable = true
    
27. 
    
28. // 通过调用crashTest(物体对象1，物体对象2) 的返回值判断是否碰撞
    
29.     // setInterval(function () {
    
30.     // crashTest(car01, car02)
    
31.     // }, 1000)
    
32. })
    
33. /**
    
34. * 碰撞监测
    
35. * 如何使用JavaScript实现包围盒检测，以判断两个梯形体是否相交。
    
36. * 通过计算梯形体的包围盒，并检测包围盒在三个轴上的投影是否相交，从而判断梯形体是否相交。
    
37. * return true:碰撞 false：不碰撞
    
38. * */
    
39. function crashTest(obj1, obj2) {
    
40.     let points1 = obj1.getBoundingBox().points
    
41.     let points2 = obj2.getBoundingBox().points
    
42. 
    
43.     // 获取x轴方向上的坐标值
    
44.     let xValues = [...new Set(points1.map(point => point[0].toFixed(3)))];
    
45. 
    
46.     // 获取y轴方向上的坐标值
    
47.     let yValues = [...new Set(points1.map(point => point[1].toFixed(3)))];
    
48. 
    
49.     // 获取z轴方向上的坐标值
    
50.     let zValues = [...new Set(points1.map(point => point[2].toFixed(3)))];
    
51. 
    
52.     // 获取x轴方向上的坐标值
    
53.     let xValues2 = [...new Set(points2.map(point => point[0].toFixed(3)))];
    
54. 
    
55.     // 获取y轴方向上的坐标值
    
56.     let yValues2 = [...new Set(points2.map(point => point[1].toFixed(3)))];
    
57. 
    
58.     // 获取z轴方向上的坐标值
    
59.     let zValues2 = [...new Set(points2.map(point => point[2].toFixed(3)))];
    
60. 
    
61. 
    
62.     let box1 = getBoundingBox(xValues, yValues, zValues);
    
63.     let box2 = getBoundingBox(xValues2, yValues2, zValues2);
    
64. 
    
65.     // 检测两个梯形体是否相交
    
66.     if (isBoundingBoxIntersect(box1, box2)) {
    
67.         console.log("两个梯形体相交");
    
68.         return true
    
69.     } else {
    
70.         console.log("两个梯形体不相交");
    
71.         return false
    
72. 
    
73.     }
    
74. }
    
75. // 定义梯形体的包围盒
    
76. function getBoundingBox(xValues, yValues, zValues) {
    
77.     // 根据梯形体的顶点坐标计算包围盒的最小和最大坐标
    
78.     let minX = Math.min(xValues[0], xValues[1]);
    
79.     let minY = Math.min(yValues[0], yValues[1]);
    
80.     let minZ = Math.min(zValues[0], zValues[1]);
    
81.     let maxX = Math.max(xValues[0], xValues[1]);
    
82.     let maxY = Math.max(yValues[0], yValues[1]);
    
83.     let maxZ = Math.max(zValues[0], zValues[1]);
    
84.     return {
    
85.         min: { x: minX, y: minY, z: minZ },
    
86.         max: { x: maxX, y: maxY, z: maxZ }
    
87.     };
    
88. }
    
89. 
    
90. // 检测两个包围盒是否相交
    
91. function isBoundingBoxIntersect(box1, box2) {
    
92.     // 判断两个包围盒在三个轴上的投影是否相交
    
93.     if (box1.max.x < box2.min.x || box1.min.x > box2.max.x) return false;
    
94.     if (box1.max.y < box2.min.y || box1.min.y > box2.max.y) return false;
    
95.     if (box1.max.z < box2.min.z || box1.min.z > box2.max.z) return false;
    
96.     return true;
    
97. }
    
98. 
    
99. 
    
100. 
     
101. 
     

复制代码