2017-06-14 49 views
0

我希望ThreeJS有一些方法可以在飛機之外對文本進行動畫處理。我寧願將文本製作爲2D動畫,只是在模型上方浮動。我試圖在畫布之外使用div,但那是指向正確位置的問題,仍然保持響應。ThreeJS靜態文本動畫

我希望它看起來像this,同時動畫文本下方的行。

回答

0

你可以做的是要創建一個2D畫布並使用它作爲紋理,這樣

var canvas1 = document.createElement('canvas'); 
 
var context1 = canvas1.getContext('2d'); 
 
context1.font = "Bold 40px Arial"; 
 
context1.fillStyle = "rgba(255,0,0,0.95)"; 
 
context1.fillText('Hello, world!', 0, 50); 
 

 
// canvas contents will be used for a texture 
 
var texture1 = new THREE.Texture(canvas1) 
 
texture1.needsUpdate = true; 
 

 
var material1 = new THREE.MeshBasicMaterial({map: texture1, side:THREE.DoubleSide }); 
 
material1.transparent = true; 
 

 
var mesh1 = new THREE.Mesh(
 
    new THREE.PlaneGeometry(canvas1.width, canvas1.height), 
 
    material1 
 
); 
 

東西