我有一个使用Orthographic cameraMapControls的项目,我的场景正在渲染,因为它应该,

然而,摄影机将渲染场景切成两半,如下所示

enter image description here

我正在像这样初始化正交摄影机

export class OrthoCamera extends THREE.OrthographicCamera {

  constructor(
    renderingContext: HTMLCanvasElement,

  ) {
    super(
      renderingContext.offsetWidth / -2,
      renderingContext.offsetWidth / 2,

      renderingContext.offsetHeight /2,
      renderingContext.offsetHeight / - 2,

      0.1,
    );
    this.move(2, 2, 2);

  }

此外,我正在创建 map 控件如下


export class Controls extends MapControls {
  constructor(camera: OrthoCamera, renderingContext: HTMLCanvasElement) {
    super(camera, renderingContext);
    this.enablePan = true;
    this.enableRotate = true;
    this.target.set(40.0, 3.0, 40.0);
    this.update(0.1);
    this.maxDistance = 240;
    this.maxPolarAngle = Math.PI / 3.2;
    this.minPolarAngle = Math.PI / 3.2;
  }
}

最后,我把所有的东西都放在一起

this.camera = new OrthoCamera(renderingContext);    
this.controls = new Controls(this.camera, renderingContext);

推荐答案

我建议您使用另一种设置正交摄影机的方法:

export class OrthoCamera extends THREE.OrthographicCamera {

  constructor( renderingContext: HTMLCanvasElement ) {
  
    const aspect =  renderingContext.offsetWidth / renderingContext.offsetHeight;
    const frustumSize = 25;
  
    super( frustumSize * aspect / - 2, frustumSize * aspect / 2, frustumSize / 2, frustumSize / - 2, 0.1, 1000 );

  }

}

如果您有一个单独的变量,甚至是一个参数,您可以更容易地调整锥体大小.值frustumSize取决于场景的大小.

Typescript相关问答推荐

如果在TypeScript中一个原始的类方法是递归的,如何使用类decorator 模式?

我们过go 不能从TypeScript中的联合中同时访问所有属性?

Angular 行为:属性类型从SignalFunction更改为布尔

将对象属性转换为InstanceType或原样的强类型方法

如何在Angular 12中创建DisplayBlock组件?

如何在TypeScrip中正确键入元素和事件目标?

是否可以从函数类型中创建简化的类型,go 掉参数中任何看起来像回调的内容,而保留其余的内容?

Select 下拉菜单的占位符不起作用

部分更新类型的类型相等

垫表页脚角v15

Typescript -返回接口中函数的类型

如何通过转换器类继承使用多态将对象从一种类型转换为另一种类型

如何从JWT Reaction中提取特定值

如何使用angular15取消选中位于其他组件中的复选框

如何在TypeScript类成员函数中使用筛选后的keyof this?

React-跨组件共享功能的最佳实践

Karma Angular Unit测试如何创建未解析的promise并在单个测试中解决它,以判断当时的代码是否只在解决后运行

有没有一种简单的方法可以访问Keyboard Shortcuts JSON文件中列出的每个命令的显示名称(标题)?

为什么我无法在 TypeScript 中重新分配函数?

如何编写一个接受 (string|number|null|undefined) 但只返回 string 且可能返回 null|undefined 的函数?