Three.js: unproject - विशिष्ट 3D ऑब्जेक्ट की 'स्क्रीन (ऊपर, बाएं)' पर वास्तविक स्थिति कैसे प्राप्त करें?

संभवतः प्रोजेक्टर का उपयोग कर रहा है, लेकिन MrDoob स्पष्ट रूप से इस बारे में अधिक जानता है :)

उह, शायद हमारे पास एक object3d.screen होना चाहिए जो Vector2 और हर रेंडर पर इसे अपडेट करना होगा?

यदि वह object3D.screen वेक्टर केवल object3D.position को हर object3D को 2 डी में ट्रांसलेट करने के लिए उपयोग किया जाता है, तो object3D.screen बहुत कम मूल्य का नहीं होगा? मेरा मतलब है: मुझे लगता है कि यह किसी भी बिंदु x, y, स्थिति x पर किसी भी जाल के z, 2D निर्देशांक में z, अनुवाद करने में सक्षम होने के लिए अधिक उपयोगी होगा।

बदले में इसका मतलब है कि हर वस्तु की हर 3 डी स्थिति को पहले से निर्धारित करना संभव नहीं होगा।

यह उदाहरण के लिए एक फ़ंक्शन THREE.3dto2d() जो या तो एक वेक्टर 3 (दृश्य में एक बिंदु का प्रतिनिधित्व करता है) या एक वेक्टर 3 और एक ऑब्जेक्ट (जहां वेक्टर 3 ऑब्जेक्ट पर एक बिंदु का प्रतिनिधित्व करता है) के लिए उपयोगी होगा।
फ़ंक्शन तब दृश्य में 3 डी स्थिति की गणना करता है।
अंत में, यह कैमरा, इसकी स्थिति, रोटेशन, प्रोजेक्शनमैटिक्स आदि लेता है, और बिंदु को 2 डी में अनुवाद करता है।

मुझे लगता है कि कैमरा फ़ंक्शन का एक पैरामीटर होना चाहिए ...

खैर ... Projector.projectScene थोड़े पहले से ही है;)

देखें, मुझे पता था कि यह प्रोजेक्टर था ... ;-)

क्या इसका उपयोग करने के लिए कोई उदाहरण है?

हम्म ... अभी तक नहीं ... उन कार्यों को रेंडरर के साथ उपयोग करने के लिए डिज़ाइन किया गया है ... वे मूल वस्तुओं के साथ कोई संबंध नहीं प्रदान करने के लिए तत्वों की एक सूची लौटाते हैं। शायद मुझे मूल वस्तुओं के लिए कुछ लिंक डालना चाहिए और वह काम करेगा ... हम्म, थोड़ा और सोचने की जरूरत है।

मैं वर्तमान में छुट्टियों पर हूं, लेकिन जैसे ही मैं वापस (अगले सप्ताह) एक लेंस भड़कना डेमो (या कुछ) करूंगा।

निश्चित रूप से, अपनी छुट्टियों का आनंद लें और मैं नए डेमो की प्रतीक्षा कर रहा हूं! :-)

हम्म, यह मेरे लिए (r32) काम करता था, अब r35 में नहीं है।

  toScreenXY: function(position, camera, jqdiv) {
    // converts 3D position to screen coords
    var pos = position.clone();
    projScreenMat = new THREE.Matrix4();
    projScreenMat.multiply( camera.projectionMatrix, camera.matrix);
    projScreenMat.multiplyVector3(pos);
    return { x: (pos.x+1)*jqdiv.width()/2 + jqdiv.offset().left, 
             y:(-pos.y+1)*jqdiv.height()/2 +jqdiv.offset().top }; 
  },

projScreenMat.multiplyVector3(pos); बाद -1 और 1 (0,0) दृश्य के केंद्र में छाया हुआ करता था।), लेकिन अब अप्रत्याशित रूप से भिन्न होता है।

हाँ, camera.matrix को अब camera.matrixWorldInverse बदला जाना चाहिए।
इसके साथ प्रयास करें:

toScreenXY: function ( position, camera, jqdiv ) {

    var pos = position.clone();
    projScreenMat = new THREE.Matrix4();
    projScreenMat.multiply( camera.projectionMatrix, camera.matrixWorldInverse );
    projScreenMat.multiplyVector3( pos );

    return { x: ( pos.x + 1 ) * jqdiv.width() / 2 + jqdiv.offset().left,
         y: ( - pos.y + 1) * jqdiv.height() / 2 + jqdiv.offset().top };

}

काम किया है कि हाँ, परिवर्तन matrices के बारे में पता नहीं था। आशा है कि इस प्रक्षेपण समारोह ने alivedise के प्रश्न का उत्तर दिया।

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

धन्यवाद।

@ imrantariq2011 : यह वास्तव में इस मुद्दे से संबंधित नहीं है, क्या आपको एक नया खोलने का मन है? धन्यवाद।

बनावट मानचित्रण प्रयोजनों के लिए मैं x प्राप्त करने में सक्षम होना चाहता हूं, y स्क्रीन एक दिए गए चेहरे के लिए प्रत्येक कोने के लिए निर्देशांक करता है।

मैं देख सकता हूं कि उपरोक्त (toScreenXY: function) का उपयोग करके यह कैसे किया जा सकता है - लेकिन पहले दिए गए चेहरे के लिए विश्व रूपांतरित (स्केल्ड, अनुवादित और घुमाए गए) कोने की आवश्यकता होती है। मैंने Projector.projectScene को देखने में कुछ समय बिताया है और मुझे आश्चर्य है कि अगर उपरोक्त लक्ष्य को प्राप्त करने का एक सरल तरीका है और यह ऑब्जेक्ट की तरह दिखता है ।matrixWorld.getPosition () चेहरे के कोने के बजाय ऑब्जेक्ट का केंद्रक प्राप्त कर सकता है।

हाँ, ऊपर दिया गया कोड किसी एक के लिए था। यदि आपको .projectScene() से कोड के बिट्स को बाहर निकालने के लिए सबसे अच्छा है तो कई बिंदुओं को प्रोजेक्ट करने की आवश्यकता है।

यहां आने वाले लोग इस बारे में जानना चाहते हैं:

https://github.com/zachberry/threejs-tracking-3d-to-2d

मैं इसका उपयोग करता हूं, यह काम करता है:

फंक्शन toScreenXY (पॉस 3 डी)
{{
var प्रोजेक्टर = नया THREE.Projector ();
var v = प्रोजेक्टर.projectVector (पॉस 3 डी, कैमरा);
var percX = (vx + 1) / 2;
var percY = (-vy + 1) / 2;
var left = percX * window.innerWidth;
var top = percY * window.innerHeight;

नया THREE.Vector2 (बाएं, ऊपर) लौटें;
}

शुक्रवार, 1 अगस्त, 2014 11:24 पूर्वाह्न, आर्टेम फिटिस्किन नोटिफिकेशन @github.com ने लिखा:

जब मैं toScreenXY का उपयोग करता हूं, तो मुझे बहुत बड़े मूल्य मिलते हैं।
कंसोल.लॉग (पॉज़): // x: -1474.1436403989792, y: -730.829023361206, z: 3.0004000663757324
और इसे jqdiv के साथ गुणा करने के बाद, फ़ंक्शन बहुत बड़ा x और y देता है।
मैं क्या गलत कर रहा हूँ?
-
इस ईमेल का उत्तर सीधे दें या इसे GitHub पर देखें।

@ यारीलजेक

के रूप में में कहा गया है दिशा निर्देशों , मदद अनुरोध करने के लिए निर्देशित किया जाना चाहिए stackoverflow । यह बोर्ड बग और सुविधा अनुरोधों के लिए है।

ठीक है ... अभी तक श्री doob खुद कोड डाल दिया, तो क्या देता है?

@ साललजेक # 1979

उन्नयन के बाद भी किसी को इसकी आवश्यकता है ...

function screenXY(obj){

  var vector = obj.clone();
  var windowWidth = window.innerWidth;
  var minWidth = 1280;

  if(windowWidth < minWidth) {
    windowWidth = minWidth;
  }

  var widthHalf = (windowWidth/2);
  var heightHalf = (window.innerHeight/2);

  vector.project(camera);

  vector.x = ( vector.x * widthHalf ) + widthHalf;
  vector.y = - ( vector.y * heightHalf ) + heightHalf;
  vector.z = 0;

  return vector;

};

ठीक है, बहुत पुराना मुद्दा है, लेकिन मेरे पास एक नेस्टेड ऑब्जेक्ट था, जो उपरोक्त कोड के साथ काम नहीं करता था।
मेरा मामला था: मैं प्रतिपादन के बाद एक नेस्टेड ऑब्जेक्ट के लिए वास्तविक x-and-y (और z) स्थिति चाहता था, इसलिए मैंने उपरोक्त उदाहरणों को अनुकूलित किया।
कृपया ध्यान दें:

1. अब आप उपर्युक्त उदाहरणों में केवल ऑब्जेक्ट के बजाय पूरे ऑब्जेक्ट को एक तर्क के रूप में देते हैं।
2. इसके अलावा यह केवल काम करेगा जब रेंडरर ने काम किया है और बुलाया है
3. यह गैर-नेस्टेड वस्तुओं के लिए भी काम करता है, लेकिन यह कुछ गणना भी करेगा।
4. यह आपको एक स्क्रीन-ज़ेड भी देता है, जिसका इस्तेमाल डोमिनल या zSort लेबल को सॉर्ट करने के लिए किया जा सकता है।
   स्क्रीन-जेड सापेक्ष 0 और 1 के बीच है, कैमरे / रेंडरर के सामने और पीछे की कतरन वाले विमानों के सापेक्ष और यह मेरे उद्देश्यों (छंटाई) के लिए ठीक काम करता है।
5. आप रेंडरर्स को वर्तमान चौड़ाई और ऊंचाई रेंडरर.डोमे.लीमेंटेशन और रेंडरर द्वारा प्राप्त कर सकते हैं।

scene.updateMatrixWorld(); 

तथा

parent.updateMatrixWorld(); 

`` `जे.एस.
फ़ंक्शन nestedObjecttoScreenXYZ (obj, कैमरा, चौड़ाई, ऊंचाई)
{{
var वेक्टर = नया THREE.Vector3 ();
वेक्टर.सेटफ्रॉममैट्रिक्स मैट्रिक्स (obj.matrixWorld);
var widthHalf = (चौड़ाई / 2);
var heightHalf = (ऊंचाई / 2);
वेक्टर.प्रोजेक्ट (कैमरा);
वेक्टर.x = (वेक्टर.x * चौड़ाईहल्फ़) + चौड़ाईहल्फ़;
वेक्टर.य = - (वेक्टर.य * ऊंचाईहल्फ़) + ऊंचाईहल्फ़;
वापसी वेक्टर;
};

typical call:
```js
var screenpos=NestedObjecttoScreenXY(object,camera,renderer.domElement.width,renderer.domElement.height,true);

बस के मामले में किसी को भी एक ही समस्या में चलाता है।