截至angular-cli 1.0.0 :
npm install three --save
npm install @types/three
在AppComponent.html中添加div元素:
在AppComponent.ts中导入three.js: import * as THREE from 'three';
使用 @ViewChild('rendererContainer') rendererContainer: ElementRef; 获取div元素的句柄
在构造函数/生命周期方法中进行必要的设置 . 注意: ViewChild 在 ngAfterViewInit 之前不可用 .
完整AppComponent:
import {Component, ViewChild, ElementRef} from '@angular/core';
import * as THREE from 'three';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
@ViewChild('rendererContainer') rendererContainer: ElementRef;
renderer = new THREE.WebGLRenderer();
scene =