Three.js - AxisHelper withTextGeometry पर लेबल और रोटेशन मुद्दा

Question

मैं एक क्षेत्र और एक अन्य subwindow (सही तल में) मैं कहाँ (एक्स, वाई, जेड) मुख्य दृश्य की धुरी तैयार की है के साथ एक मुख्य दृश्य है।

इस सबविंडो में, मैं प्रत्येक धुरी पर लेबल "एक्स" "वाई" और "जेड" को आकर्षित करना चाहता हूं (प्रत्येक एक्सिसहेल्पर के अंत में अधिक सटीक रूप से स्थित)। मुझे पता है कि टेक्स्टजीमेट्री का उपयोग कैसे करें, लेकिन मुद्दा यह है कि मैं इन लेबलों को उपयोगकर्ता को हमेशा सामने आने के लिए घुमाने के लिए नहीं कर सकता।

आप [नीचे दिए गए लिंक] पर समस्या देख सकते हैं [1]: लेबल "एक्स" अपेक्षाकृत अक्ष के लिए और कैमरे के साथ घूर्णन है तय हो गई है, तो यह हमेशा उपयोगकर्ता के चेहरे में नहीं है।

इन दो लिंक link1 और link2 से, मैं (, मेरे उदाहरण में मैं केवल "एक्स" लेबल के साथ की कोशिश की) जोड़ने की कोशिश की:

function addLabelAxes() { 

    // Axes label 
    var loader = new THREE.FontLoader(); 
    loader.load('js/helvetiker_regular.typeface.js', function (font) { 

    var textGeo1 = new THREE.TextGeometry('X', { 
     font: font, 
     size: 5, 
     height: 0.1, 
     bevelThickness: 0.1, 
     bevelSize: 0.1, 
     bevelEnabled: true, 
    }); 

    var color = new THREE.Color(); 
    color.setRGB(255, 255, 255); 
    textMaterial = new THREE.MeshBasicMaterial({ color: color }); 
    var meshText1 = new THREE.Mesh(textGeo1, textMaterial); 

    // Position of axes extremities 
    var positionEndAxes = axes2.geometry.attributes.position; 

    var label1X = positionEndAxes.getX(0); 
    meshText1.position.x = label1X + axisLength; 
    meshText1.position.y = 0; 
    meshText1.position.z = 0; 

    // Rotation of "X" label 
    //meshText1.rotation = zoomCamera.rotation; 
    meshText1.lookAt(zoomCamera.position); 

    // Add meshText to zoomScene 
    zoomScene.add(meshText1); 

    }); 

} 

zoomCamera एक PerspectiveCamera जो subwindow का कैमरा है का प्रतिनिधित्व करता है (यानी zoomScene); मैं ऐसा करके zoomScene को TextGeometry जोड़ें:

zoomScene.add(meshText1); 

द्वारा किसी को भी कर सकते हैं कि मेरी कोड में गलत क्या है? मुझे आश्चर्य है कि अगर मैं अपने आप पर "एक्स" लेबल घुमाने के लिए, यानी "एक्स" लेबल धुरी की तरह घूर्णन कर रहा है, लेकिन एक आत्म (स्थानीय) अभिविन्यास रोटेशन थीटा कोण के एक समारोह के रूप में लागू किया जाता है, तो लेबल हमेशा चेहरे में रखा जाता है कर सकते हैं कैमरा रोटेशन के दौरान उपयोगकर्ता का?

आपकी मदद के लिए धन्यवाद।

Answer 1

आप शायद THREE.SPRITE के लिए देख रहे हैं। the docs से:

Object3D->स्प्राइट: एक स्प्राइट एक 3 डी दृश्य जिसमें कैमरे की ओर हमेशा सामना कर रहा है में एक विमान है। यहाँ

var map = new THREE.TextureLoader().load("sprite.png"); 
var material = new THREE.SpriteMaterial({ map: map, color: 0xffffff, fog: true }); 
var sprite = new THREE.Sprite(material); 
scene.add(sprite); 

एक समान परिदृश्य (अलग स्थिति के साथ 3 बढ़ाया स्प्राइट) के एक working example है:

इसका इस्तेमाल करने के लिए एक सरल उदाहरण है। आप github पर कोड पा सकते हैं।