diff --git a/index.html b/index.html
index c2c8933..31e0102 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,10 @@
-
+
CADViewComponent
diff --git a/package.json b/package.json
index 811eec5..c2f0d56 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,7 @@
"main": "src/index.ts",
"private": true,
"scripts": {
- "dev": "vite",
+ "dev": "vite --host",
"build": "tsc && vite build",
"preview": "vite preview"
},
@@ -29,5 +29,6 @@
"polylabel": "^1.1.0",
"xaop": "^2.0.0",
"webcad_ue4_api": "http://gitea.cf/cx/webcad-ue4-api/archive/3.2.4.tar.gz"
- }
+ },
+ "packageManager": "pnpm@9.1.1+sha1.09ada6cd05003e0ced25fb716f9fda4063ec2e3b"
}
diff --git a/src/CameraControls.ts b/src/CameraControls.ts
index 6607ddb..28d93bb 100644
--- a/src/CameraControls.ts
+++ b/src/CameraControls.ts
@@ -1,24 +1,24 @@
import * as THREE from 'three';
-import { KeyBoard, MouseKey } from './KeyEnum';
import { Vector3 } from 'three';
+import { equaln } from './GeUtils';
+import { KeyBoard, MouseKey } from './KeyEnum';
import { Viewer } from './Viewer';
//相机控制状态
export enum CameraControlState
{
- Null = 0, Pan = 1, Rotate = 2, Scale = 3
+ Null = 0, Pan = 1, Rotate = 2, Scale = 4
}
export class CameraControls
{
- m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale, CameraControlState.Pan];
+ m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale | CameraControlState.Pan, CameraControlState.Pan];
m_domElement: HTMLElement;//HTMLDocument
//起始点击
m_StartClickPoint: THREE.Vector3 = new THREE.Vector3();
m_EndClickPoint: THREE.Vector3 = new THREE.Vector3();
- m_DollyStart: THREE.Vector2 = new THREE.Vector2();
- m_DollyEnd: THREE.Vector2 = new THREE.Vector2();
+ m_DollyStart: number;
m_KeyDown = new Map();
m_MouseDown = new Map();
@@ -40,16 +40,16 @@ export class CameraControls
{
if (this.m_domElement)
{
- this.m_domElement.addEventListener("mousedown", this.onMouseDown, false)
- this.m_domElement.addEventListener("mousemove", this.onMouseMove, false)
- this.m_domElement.addEventListener("mouseup", this.onMouseUp, false)
+ this.m_domElement.addEventListener("mousedown", this.onMouseDown, false);
+ this.m_domElement.addEventListener("mousemove", this.onMouseMove, false);
+ this.m_domElement.addEventListener("mouseup", this.onMouseUp, false);
window.addEventListener("keydown", this.onKeyDown, false);
window.addEventListener("keyup", this.onKeyUp, false);
- this.m_domElement.addEventListener('wheel', this.onMouseWheel, false);
+ this.m_domElement.addEventListener('wheel', this.onMouseWheel, { passive: false });
- this.m_domElement.addEventListener('touchstart', this.onTouchStart, false);
+ this.m_domElement.addEventListener('touchstart', this.onTouchStart, { passive: false });
this.m_domElement.addEventListener('touchend', this.onTouchEnd, false);
- this.m_domElement.addEventListener('touchmove', this.onTouchMove, false);
+ this.m_domElement.addEventListener('touchmove', this.onTouchMove, { passive: false });
window.addEventListener("blur", this.onBlur, false);
}
@@ -62,7 +62,7 @@ export class CameraControls
{
this.m_KeyDown.clear();
this.m_MouseDown.clear();
- }
+ };
//触屏开始事件
onTouchStart = (event: TouchEvent) =>
@@ -76,15 +76,15 @@ export class CameraControls
var dx = event.touches[0].pageX - event.touches[1].pageX;
var dy = event.touches[0].pageY - event.touches[1].pageY;
var distance = Math.sqrt(dx * dx + dy * dy);
- this.m_DollyStart.set(0, distance);
+ this.m_DollyStart = distance;
}
this.m_State = this.m_TouthTypeList[event.touches.length - 1];
}
- }
+ };
onTouchEnd = (event: TouchEvent) =>
{
this.m_State = CameraControlState.Null;
- }
+ };
onTouchMove = (event: TouchEvent) =>
{
event.preventDefault();
@@ -93,40 +93,38 @@ export class CameraControls
this.m_EndClickPoint.set(event.touches[0].pageX, event.touches[0].pageY, 0);
let vec = this.m_EndClickPoint.clone().sub(this.m_StartClickPoint);
- switch (this.m_State)
- {
- case CameraControlState.Pan:
- {
- this.m_Viewer.Pan(vec);
- break;
- }
- case CameraControlState.Scale:
- {
- var dx = event.touches[0].pageX - event.touches[1].pageX;
- var dy = event.touches[0].pageY - event.touches[1].pageY;
- var distance = Math.sqrt(dx * dx + dy * dy);
- this.m_DollyEnd.set(0, distance);
- if (distance > this.m_DollyStart.y)
- {
- this.m_Viewer.Zoom(0.95);
- }
- else
- {
- this.m_Viewer.Zoom(1.05)
- }
- this.m_DollyStart.copy(this.m_DollyEnd);
- break;
- }
- case CameraControlState.Rotate:
+ if (this.m_State & CameraControlState.Pan)
+ {
+ this.m_Viewer.Pan(vec);
+ }
+ if (this.m_State & CameraControlState.Scale)
+ {
+ var dx = event.touches[0].pageX - event.touches[1].pageX;
+ var dy = event.touches[0].pageY - event.touches[1].pageY;
+
+ var distance = Math.sqrt(dx * dx + dy * dy);
+ if (!equaln(this.m_DollyStart / distance, 1, 0.05))//轻微防抖
+ {
+
+ if (distance > this.m_DollyStart)
{
- this.m_Viewer.Rotate(vec.multiplyScalar(2));
- break;
+ this.m_Viewer.Zoom(0.95);
}
+ else
+ {
+ this.m_Viewer.Zoom(1.05);
+ }
+ this.m_DollyStart = distance;
+ }
+ }
+ if (this.m_State & CameraControlState.Rotate)
+ {
+ this.m_Viewer.Rotate(vec.multiplyScalar(2));
}
this.m_StartClickPoint.copy(this.m_EndClickPoint);
this.m_Viewer.m_bNeedUpdate = true;
- }
+ };
beginRotate()
{
this.m_State = CameraControlState.Rotate;
@@ -178,13 +176,13 @@ export class CameraControls
break;
}
}
- }
+ };
onMouseUp = (event: MouseEvent) =>
{
event.preventDefault();
this.m_State = CameraControlState.Null;
this.m_MouseDown.set(event.button, false);
- }
+ };
onMouseMove = (event: MouseEvent) =>
{
event.preventDefault();
@@ -195,28 +193,16 @@ export class CameraControls
(this.m_LeftUseRotate ||
(this.m_KeyDown.get(KeyBoard.Control))
)
- && this.m_State == CameraControlState.Rotate
+ && this.m_State & CameraControlState.Rotate
)
{
this.m_Viewer.Rotate(changeVec);
}
- switch (this.m_State)
+ if (this.m_State & CameraControlState.Pan)
{
- case CameraControlState.Pan:
- {
- this.m_Viewer.Pan(changeVec);
- break;
- }
- case CameraControlState.Rotate:
- {
- break;
- }
- case CameraControlState.Scale:
- {
- break;
- }
+ this.m_Viewer.Pan(changeVec);
}
- }
+ };
/**
* 鼠标滚轮事件
*
@@ -237,14 +223,14 @@ export class CameraControls
{
this.m_Viewer.Zoom(1.4, pt);
}
- }
+ };
//按键
onKeyDown = (event: KeyboardEvent) =>
{
this.m_KeyDown.set(event.keyCode, true);
- }
+ };
onKeyUp = (event: KeyboardEvent) =>
{
this.m_KeyDown.set(event.keyCode, false);
- }
+ };
}
diff --git a/src/ViewSrc/index.ts b/src/ViewSrc/index.ts
index a739c2c..86c37e6 100644
--- a/src/ViewSrc/index.ts
+++ b/src/ViewSrc/index.ts
@@ -1,7 +1,6 @@
// import { Color, Face3, MeshBasicMaterial, Object3D, Vector2, Vector3 } from "three";
// import "./style.css";
import { Color, MeshBasicMaterial, Vector3 } from "three";
-import { CameraControlState } from "../CameraControls";
import { GetBox } from "../GeUtils";
import { LoadBoard } from "../Utils";
import { Viewer } from "../Viewer";
@@ -21,8 +20,8 @@ document.body.appendChild(btn3);
let el = document.createElement("canvas");
-el.style.width = "80%";
-el.style.height = "80%";
+el.style.width = "100%";
+el.style.height = "80vh";
document.body.appendChild(el);
let view = new Viewer(el, (settings) =>
@@ -38,9 +37,9 @@ let view = new Viewer(el, (settings) =>
});
//修改这个顺序 改变1 2 3 个触摸点时的触发状态.
-view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale, CameraControlState.Pan];
+// view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale, CameraControlState.Pan];
//例如,修改单指滑动为平移.
-view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Pan, CameraControlState.Scale, CameraControlState.Rotate];
+// view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Pan, CameraControlState.Scale, CameraControlState.Rotate];
//加载
btn.onclick = () =>