three.js带有Angular的OrthographicTrackballControls [英] three.js OrthographicTrackballControls with Angular

问题描述

是否可以在Angular 4中使用three.js的OrthographicTrackballControls?我尝试过:

Is it possible to use the OrthographicTrackballControls of three.js with Angular 4? I tried with:

npm install --save three-orthographic-trackball-controls 

在我的组件中:

import { OrthographicTrackballControls } from 'three-orthographic-trackball-controls';

我没有成功，也不知道如何做到这一点.我找到了OrbitControls的解决方案，但是使用了另一个npm包和RequireJS.解决此问题的任何想法都会有所帮助.预先感谢.

I had no success and no idea on how to do this. I found solutions for OrbitControls, but using another npm package and RequireJS. Any ideas to solve this issue will be helpful. Thanks in advance.

推荐答案

查看使用Angular + Three.js(包括OrbitControls和ColladaLoader)的工作示例:

See working example of using Angular + Three.js including OrbitControls and ColladaLoader: https://github.com/makimenko/angular-three-examples

当前，Three.js示例未包含在模块中，并且在Angular打字稿代码中使用它们可能会有些棘手.解决方案/解决方法之一可能是:

Currently, Three.js examples are not included into a module and use them in Angular typescript code could be a little bit tricky. One of solution/workaround could be:

首先，包括依赖项:

three
@types/three

第二，导入组件:

import * as THREE from 'three';
import "./js/EnableThreeExamples";
import "three/examples/js/controls/OrbitControls";
import "three/examples/js/loaders/ColladaLoader";

在scene.component.ts中将OrbitControls替换为OrthographicTrackballControls.很有可能还应该调整相机的特性.

Replace OrbitControls to OrthographicTrackballControls in scene.component.ts. Most probably Camera characteristics should be adjusted as well.

this.controls = new THREE.OrbitControls(this.camera);
this.controls.rotateSpeed = 1.0;
this.controls.zoomSpeed = 1.2;
this.controls.addEventListener('change', this.render);

希望这可以帮助您开始.它还显示了一个替代解决方案(直接从three.js模块访问原始示例，而无需安装其他NPM软件包).

Hope this could help you to start. Also it shows an alternative solution (directly accessing original examples from three.js module without installation of additional NPM packages).

这篇关于three.js带有Angular的OrthographicTrackballControls的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！