|
@@ -226,17 +226,17 @@
|
|
|
controls.zoomToCursor = true;
|
|
|
// controls.update();
|
|
|
// 监听相机移动事件-限制只能在当前空间范围内移动
|
|
|
- controls.addEventListener('change', () => {
|
|
|
- // 检查相机位置是否超出边界框
|
|
|
- if (boundary && !boundary.containsPoint(camera.position)) {
|
|
|
- let clampedPosition = new THREE.Vector3( );
|
|
|
- boundary.clampPoint(camera.position,clampedPosition);
|
|
|
- if(clampedPosition){
|
|
|
- camera.position.copy(clampedPosition);
|
|
|
- // controls.target.copy(clampedPosition);
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
+ // controls.addEventListener('change', () => {
|
|
|
+ // // 检查相机位置是否超出边界框
|
|
|
+ // if (boundary && !boundary.containsPoint(camera.position)) {
|
|
|
+ // let clampedPosition = new THREE.Vector3( );
|
|
|
+ // boundary.clampPoint(camera.position,clampedPosition);
|
|
|
+ // if(clampedPosition){
|
|
|
+ // camera.position.copy(clampedPosition);
|
|
|
+ // // controls.target.copy(clampedPosition);
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // });
|
|
|
// controls.target = new THREE.Vector3( );;
|
|
|
// camera.lookAt(that.controlStarPosition.x,that.controlStarPosition.y,that.controlStarPosition.z);
|
|
|
raycaster = new THREE.Raycaster();
|
|
@@ -326,6 +326,7 @@
|
|
|
let index = mesh.instanceId;//射线相交是的实例序号
|
|
|
let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
|
|
|
if(floor.name == "花园"){//花园
|
|
|
+ return false;
|
|
|
let selectMesh = that.gltfSpaces.find(it=>{return it.spaceType==14 && it.instancedMeshIndexList[0].instancedAtIndex==index})
|
|
|
spaceId = selectMesh.spaceId;
|
|
|
}else{//室内
|
|
@@ -336,52 +337,30 @@
|
|
|
// let spaceId = that.gltfSpaces[index].spaceId;//获取选中实例的空间id
|
|
|
console.warn("***checkIntersection-地板***",mesh,floor,index,spaceId,that.spaceId)
|
|
|
//当前拾取到的是本空间的底部-意味着用户点击了地板
|
|
|
- if(floor && spaceId == that.spaceId){
|
|
|
+ // if(floor && spaceId == that.spaceId){
|
|
|
// console.warn("***checkIntersection-地板***",mesh,floor)
|
|
|
moveCarmer(mesh.point);
|
|
|
return false;
|
|
|
- }
|
|
|
+ // }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
//显示当前选中的视角或者隐藏所有视角-因为截图时不能保留视角
|
|
|
function hideOrShowActor (type) {
|
|
|
console.warn("***hideOrShowActor***",type)
|
|
|
- if(type=='hide'){
|
|
|
- that.actors.forEach(it=>{
|
|
|
- it.visible = false;//隐藏所有的视角的mesh模型
|
|
|
- })
|
|
|
- }else{
|
|
|
- if(!that.currentActor){
|
|
|
- uni.showToast({
|
|
|
- icon: "none",
|
|
|
- title: "没有视角!",
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- that.actors.forEach(it=>{
|
|
|
- if(that.currentActor.userIndex==it.userIndex){
|
|
|
- it.visible = false;//隐藏即将切换到的视角的mesh模型
|
|
|
- }else{
|
|
|
- it.visible = true;//显示其他视角的模型
|
|
|
- }
|
|
|
- })
|
|
|
+ if(!that.currentActor){
|
|
|
+ this.$message.warning("没有视角!");
|
|
|
+ return false;
|
|
|
}
|
|
|
}
|
|
|
//自动切换视角
|
|
|
function switchActor () {
|
|
|
if(!that.currentActor){
|
|
|
- uni.showToast({
|
|
|
- icon: "none",
|
|
|
- title: "没有当前视角!",
|
|
|
- });
|
|
|
+ this.$message.warning("没有当前视角!");
|
|
|
return false;
|
|
|
}
|
|
|
if(!that.actors || that.actors.length==0){
|
|
|
- uni.showToast({
|
|
|
- icon: "none",
|
|
|
- title: "没有视角!",
|
|
|
- });
|
|
|
+ this.$message.warning("没有视角!");
|
|
|
return false;
|
|
|
}
|
|
|
let index = that.currentActor.userIndex;//当前视角的序号
|
|
@@ -398,8 +377,8 @@
|
|
|
let _x = point.x - camera.position.x;//x轴移动的距离
|
|
|
let _z = point.z - camera.position.z;//z轴移动的距离
|
|
|
// console.warn("***moveCarmer***",_x,_z)
|
|
|
- let cameraNewPosition = {x:camera.position.x + _x,y:1.0,z:camera.position.z + _z};
|
|
|
- let targetNewPosition = {x:controls.target.x + _x,y:1.0,z:controls.target.z + _z};
|
|
|
+ let cameraNewPosition = {x:camera.position.x + _x,y:1.5,z:camera.position.z + _z};
|
|
|
+ let targetNewPosition = {x:controls.target.x + _x,y:1.5,z:controls.target.z + _z};
|
|
|
let oldUp = {x:0,y:1,z:0};
|
|
|
let newUp = {x:0,y:1,z:0};
|
|
|
moveTip(cameraNewPosition)
|
|
@@ -449,13 +428,6 @@
|
|
|
//移动视角点位
|
|
|
function moveActor (obj) {
|
|
|
clearEvent();//注销事件监听
|
|
|
- that.actors.forEach(it=>{
|
|
|
- if(obj.userIndex==it.userIndex){
|
|
|
- it.visible = false;//隐藏
|
|
|
- }else{
|
|
|
- it.visible = true;//显示其他
|
|
|
- }
|
|
|
- })
|
|
|
// console.warn("***moveActor***",obj)
|
|
|
that.currentActor = obj;//记录下当前的视角对象 mesh网格模型
|
|
|
let cameraNewPosition = obj.position;
|
|
@@ -484,67 +456,66 @@
|
|
|
defaulIndex = 0;
|
|
|
}
|
|
|
that.actors = [];
|
|
|
- that.loader.load("https://dm.static.elab-plus.com/miniProgram/hs/gltf/sxtgltf.gltf", ( gltf ) => {
|
|
|
- spaceObj.actors.forEach((actor,index)=>{
|
|
|
- let model = gltf.scene; // 获取模型
|
|
|
- let cloneModel = model.clone(true);//赋值模型,准备复用
|
|
|
- cloneModel.children.map((v,i)=>{
|
|
|
- if(v.material){
|
|
|
- v.material = model.children[i].material.clone()
|
|
|
+ spaceObj.actors.forEach((actor,index)=>{
|
|
|
+ // let model = gltf.scene; // 获取模型
|
|
|
+ // let cloneModel = model.clone(true);//赋值模型,准备复用
|
|
|
+ // cloneModel.children.map((v,i)=>{
|
|
|
+ // if(v.material){
|
|
|
+ // v.material = model.children[i].material.clone()
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // let cube = cloneModel;
|
|
|
+ let cube = {};
|
|
|
+ cube.name = "actor";
|
|
|
+ cube.userType = "mesh";
|
|
|
+ //新的摄像机的位置-新的摄像机角度是倾斜角度,所以z值需要计算,高度设置为模型高度的2倍
|
|
|
+ let _actorLoaction = actor.actorLocation.split(',');//x y z
|
|
|
+ let _actorTransform = actor.actorTransform.split(',');//旋转角度,取第三个值
|
|
|
+ let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]));//将度转化为弧度。
|
|
|
+ let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
|
|
|
+ if(parseInt(_actorLoaction[1])==0){//X轴
|
|
|
+ _actorLoaction[1] = spaceObj.centerX;
|
|
|
+ }
|
|
|
+ if(parseInt(_actorLoaction[0])==0){//Y轴
|
|
|
+ _actorLoaction[0] = spaceObj.centerY;
|
|
|
+ }
|
|
|
+ let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
|
|
|
+ let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
|
|
|
+ let px = spaceObj.centerX + X_C;
|
|
|
+ let py = spaceObj.centerY + Y_C;
|
|
|
+ let position = {
|
|
|
+ x:(parseInt(px))/100,
|
|
|
+ y:1.5,
|
|
|
+ z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
|
|
|
+ }
|
|
|
+ //新的观察点的位置-取模型的中心点坐标,加上高度,由于模型都是贴地的,所以高度设置为1.5
|
|
|
+ let targetNewPosition = {
|
|
|
+ x:position.x + Math.sin(_hd),
|
|
|
+ y:1.5 + Math.tan(_hdY),
|
|
|
+ z:(position.z - Math.cos(_hd)),
|
|
|
+ }
|
|
|
+ cube.position = position;
|
|
|
+ // cube.scale.set(2, 2, 2);
|
|
|
+ cube.userIndex = index;
|
|
|
+ cube.actorEum = index;
|
|
|
+ cube.targetNewPosition = targetNewPosition;
|
|
|
+ // cube.visible = false;
|
|
|
+ console.warn("*actors*",cube)
|
|
|
+ that.actors.push(cube);//添加视角
|
|
|
+ if(index == defaulIndex){//隐藏当前视角
|
|
|
+ // cube.visible = false;
|
|
|
+ that.currentActor = cube;//记录下当前的视角对象 mesh网格模型
|
|
|
+ let param = {
|
|
|
+ type: 'CLK', //埋点类型
|
|
|
+ clkId: 'clk_2cmina_23080411', //点击ID
|
|
|
+ clkName: 'visualangle_clk', //点击前往的页面名称
|
|
|
+ clkParams: {
|
|
|
+ locusName: "预制视角",
|
|
|
+ type:that.actors[index].actorEum
|
|
|
}
|
|
|
- })
|
|
|
- let cube = cloneModel;
|
|
|
- cube.name = "actor";
|
|
|
- cube.userType = "mesh";
|
|
|
- //新的摄像机的位置-新的摄像机角度是倾斜角度,所以z值需要计算,高度设置为模型高度的2倍
|
|
|
- let _actorLoaction = actor.actorLocation.split(',');//x y z
|
|
|
- let _actorTransform = actor.actorTransform.split(',');//旋转角度,取第三个值
|
|
|
- let _hd = THREE.MathUtils.degToRad(parseInt(_actorTransform[2]));//将度转化为弧度。
|
|
|
- let _hdY = THREE.MathUtils.degToRad(parseInt(_actorTransform[1]));//Y轴方向上将度转化为弧度。
|
|
|
- if(parseInt(_actorLoaction[1])==0){//X轴
|
|
|
- _actorLoaction[1] = spaceObj.centerX;
|
|
|
- }
|
|
|
- if(parseInt(_actorLoaction[0])==0){//Y轴
|
|
|
- _actorLoaction[0] = spaceObj.centerY;
|
|
|
- }
|
|
|
- let X_C = _actorLoaction[0] - spaceObj.centerY;//X轴偏移量
|
|
|
- let Y_C = _actorLoaction[1] - spaceObj.centerX;//Y轴偏移量
|
|
|
- let px = spaceObj.centerX + X_C;
|
|
|
- let py = spaceObj.centerY + Y_C;
|
|
|
- let position = {
|
|
|
- x:(parseInt(px))/100,
|
|
|
- y:1.0,
|
|
|
- z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
|
|
|
- }
|
|
|
- //新的观察点的位置-取模型的中心点坐标,加上高度,由于模型都是贴地的,所以高度设置为1.0
|
|
|
- let targetNewPosition = {
|
|
|
- x:position.x + Math.sin(_hd),
|
|
|
- y:1.0 + Math.tan(_hdY),
|
|
|
- z:(position.z - Math.cos(_hd)),
|
|
|
- }
|
|
|
- cube.position.set(position.x,position.y,position.z)
|
|
|
- cube.scale.set(2, 2, 2);
|
|
|
- cube.userIndex = index;
|
|
|
- cube.actorEum = index;
|
|
|
- cube.targetNewPosition = targetNewPosition;
|
|
|
- console.warn("*actors*",cube)
|
|
|
- scene.add(cube);
|
|
|
- that.actors.push(cube);//添加视角
|
|
|
- if(index == defaulIndex){//隐藏当前视角
|
|
|
- cube.visible = false;
|
|
|
- that.currentActor = cube;//记录下当前的视角对象 mesh网格模型
|
|
|
- let param = {
|
|
|
- type: 'CLK', //埋点类型
|
|
|
- clkId: 'clk_2cmina_23080411', //点击ID
|
|
|
- clkName: 'visualangle_clk', //点击前往的页面名称
|
|
|
- clkParams: {
|
|
|
- locusName: "预制视角",
|
|
|
- type:that.actors[index].actorEum
|
|
|
- }
|
|
|
- };
|
|
|
- util.trackRequest(param);
|
|
|
- }
|
|
|
- })
|
|
|
+ };
|
|
|
+ util.trackRequest(param);
|
|
|
+ }
|
|
|
})
|
|
|
}
|
|
|
//计算当前选中空间的平视时的观察点和摄像机的放置点位
|
|
@@ -579,7 +550,7 @@
|
|
|
//新的摄像机的位置-新的摄像机角度是倾斜角度,所以z值需要计算,高度设置为模型高度的2倍
|
|
|
let cameraNewPosition = {
|
|
|
x:(parseInt(px))/100,
|
|
|
- y:1.0,
|
|
|
+ y:1.5,
|
|
|
z:-(parseInt(py))/100,//模型Y轴坐标系正负值跟webglZ轴是相反的
|
|
|
}
|
|
|
if(cameraNewPosition){
|
|
@@ -599,10 +570,10 @@
|
|
|
console.warn("**roamPositionHandle-观察点不在空间范围-强制修正观察点位置****",JSON.stringify(cameraNewPosition))
|
|
|
}
|
|
|
}
|
|
|
- //新的观察点的位置-取模型的中心点坐标,加上高度,由于模型都是贴地的,所以高度设置为1.0
|
|
|
+ //新的观察点的位置-取模型的中心点坐标,加上高度,由于模型都是贴地的,所以高度设置为1.5
|
|
|
let targetNewPosition = {
|
|
|
x:cameraNewPosition.x + Math.sin(_hd),
|
|
|
- y:1.0 + Math.tan(_hdY),
|
|
|
+ y:1.5 + Math.tan(_hdY),
|
|
|
z:(cameraNewPosition.z - Math.cos(_hd)),
|
|
|
}
|
|
|
return {cameraNewPosition,targetNewPosition}
|