Threejs添加标签

时间:2015-04-06 18:51:21

标签: javascript three.js

关注一些previous post on stackoverflow 我试图在画布中添加标签。 我制作了第二个场景和第二个相机,以便在第一个场景中重叠我的标签。

this.sceneOrtho = new THREE.Scene();//for labels
this.scene = new THREE.Scene();// for Geometry

//camera for geometry
var SCREEN_WIDTH = window.innerWidth-5, SCREEN_HEIGHT = window.innerHeight-5;
var VIEW_ANGLE = 45, ASPECT = SCREEN_WIDTH / SCREEN_HEIGHT, NEAR = 0.1, FAR = 20;
this.camera = new THREE.PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR);
var r = 4, phi = Math.PI/4, theta = Math.PI/4;
this.camera.position.set(r*Math.cos(phi)*Math.sin(theta),r*Math.sin(phi), r*Math.cos(phi)*Math.cos(theta));
this.camera.lookAt(new THREE.Vector3(0, 0, 0));

// camera for labels
this.cameraOrtho = new THREE.OrthographicCamera( VIEW_ANGLE, ASPECT, NEAR, FAR );
this.cameraOrtho.position.z = 10;

我还将THREE.Sprite对象添加到场景sceneOrtho.add(spritey); 并渲染this.model.clearScene(this.scene); this.model.populateScene(this.scene,this.sceneOrtho);//<-------- this.renderer.clear(); this.renderer.render(this.scene, this.camera); this.renderer.clearDepth(); this.renderer.render( this.sceneOrtho, this.cameraOrtho );

但我只能看到几何图形,而不能看到我的标签。 这里有一个实时的example点击按钮测试来查看它。

1 个答案:

答案 0 :(得分:-2)

我猜场景渲染正确,但你的正交相机看起来方向不好。我没有看到为您的正射相机设置lookAt

是的,正如@westlangley写的那样,这对其他人没用。