diff --git a/source/GLRender/Camera.ts b/source/GLRender/Camera.ts index d1a32df..72f6dd0 100644 --- a/source/GLRender/Camera.ts +++ b/source/GLRender/Camera.ts @@ -131,6 +131,27 @@ class Camera{ */ public angleY:number = 0; + /** + * 视点距离 + */ + public get eyeDist(): number { + return vec3.length(this.eye); + } + + /** + * 视点缩放 + */ + public eyeScale(scale: number): this { + let dis = this.eyeDist; + if ((dis + scale) < 0) scale = .1 - dis; + vec3.set(this.eye, + (this.eye[0] / dis) * scale + this.eye[0], + (this.eye[1] / dis) * scale + this.eye[1], + (this.eye[2] / dis) * scale + this.eye[2] + ); + return this; + } + /** * 通过角度设置视点 */ @@ -140,7 +161,7 @@ class Camera{ vec3.sub(this.eye, this.eye, this.target); // 计算视点距离 - let dis = vec3.length(this.eye); + let dis = this.eyeDist; // 计算方向角 let anDir = vec3.create(); diff --git a/source/GLRender/ClassicRenderer.ts b/source/GLRender/ClassicRenderer.ts index c310d9e..1a74a55 100644 --- a/source/GLRender/ClassicRenderer.ts +++ b/source/GLRender/ClassicRenderer.ts @@ -37,7 +37,11 @@ class ClassicRenderer extends BasicRenderer<{}, IClassicRendererParams> { this.canvas.on("mouseup", () => { this.canvas.can.style.cursor = "grab" - }) + }); + + this.canvas.on("mousewheel", () => { + this.camera.eyeScale(this.canvas.wheelDelta / 100); + }); // 运行 this.run(); diff --git a/source/GLRender/GLCanvas.ts b/source/GLRender/GLCanvas.ts index 5b412c0..9cdf55c 100644 --- a/source/GLRender/GLCanvas.ts +++ b/source/GLRender/GLCanvas.ts @@ -34,6 +34,7 @@ type GLCanvasEvent = { mouseup: GLCanvas, mousemove: GLCanvas, mousedown: GLCanvas, + mousewheel: GLCanvas, resize: GLCanvas, }; @@ -244,6 +245,11 @@ class GLCanvas extends Emitter { */ public mouseDown:boolean = false; + /** + * 鼠标滚动参数 + */ + public wheelDelta: number = 0; + /** * 检测 canvas 变化 */ @@ -364,6 +370,11 @@ class GLCanvas extends Emitter { }); + this.canvas.addEventListener("mousewheel", (e) => { + this.wheelDelta = (e as any)?.wheelDelta ?? 0; + this.emit("mousewheel", this); + }) + } }