Прикрепить текст выше 3D-объект

Question

Мне интересно, можно ли прикрепить текст над 3D-объектом? Если да, то как бы я это сделал?

До сих пор я делал следующее ниже, чтобы загрузить сетку с ее материалом и, наконец, добавить ее к THREE.Object3D(); и добавить его на сцену. Отлично работает без проблем. Следующим шагом я хочу показать хороший текст над его объектом, который всегда фиксируется и может быть виден со всех сторон.

loader.load('assets/' + enemyUrl, function (geometry, materials) { 

    material = new THREE.MeshFaceMaterial(materials); 
    model = new THREE.SkinnedMesh(geometry, material); 

    var mats = model.material.materials; 

    for (var i = 0,length = mats.length; i < length; i++) { 
    var m = mats[i]; 
    m.skinning = true; 
    } 

    ensureLoop(geometry.animations[0]); 

    function ensureLoop(tmp) { 
    for (var i = 0; i < tmp.hierarchy.length; i ++) { 
     var bone = tmp.hierarchy[ i ]; 

     var first = bone.keys[ 0 ]; 
     var last = bone.keys[ bone.keys.length - 1 ]; 

     last.pos = first.pos; 
     last.rot = first.rot; 
     last.scl = first.scl; 
    } 
    } 

    model.scale.set(2.5,2.5,2.5); 

    // TODO: Randomize where to put it in the world 
    yawObject.position.y = spawnPosition.y; 
    yawObject.position.x = spawnPosition.x; 
    yawObject.position.z = spawnPosition.z; 

    yawObject.add(model); 
    scene.add(yawObject); 
}); 

Что-то вроде этого:

Это то, что моя игра выглядит сейчас:

Answer 1

уверен, что его можно. вы можете создать холст с текстом на нем, который вы используете в качестве текстуры на плоскости, которая всегда смотрит на камеру, вы также можете сделать это с помощью одной частицы, но я не совсем уверен, как она будет работать, поскольку частицы материалов имеют размер. что-то вроде:

var name = 'Rovdjuret'; 
var canvas = document.createElement('canvas'); 
var ctx = canvas.getContext("2d"); 
    ctx.font="20px Georgia"; 
    ctx.fillText(name,10,50); 

var texture = new THREE.Texture(canvas); 
    texture.needsUpdate = true; //just to make sure it's all up to date. 

var label = new THREE.Mesh(new THREE.PlaneGeometry, new THREE.MeshBasicMaterial({map:texture})); 

и внутри визуализации/цикла анимации вы делаете все метки смотрят на камеру:

label.LookAt(camera.position);