Detaillierte Erläuterung des Beispielcodes von Three.js zum Erhalten der dreidimensionalen Koordinaten per Mausklick

In diesem Artikel wird hauptsächlich der Three.js-Beispielcode zum Abrufen der dreidimensionalen Koordinaten von Mausklicks vorgestellt. Es hat einen gewissen Referenzwert und interessierte Freunde können sich darauf beziehen.

Aus beruflichen Gründen weiß ich nichts über three.js und es gibt nur sehr wenige Informationen im Internet. Daher wurde ich gebeten, die Koordinaten zu erhalten, was wirklich eine große Sache ist. Auf jeden Fall wurde es endlich wahr.

Da Sie nun die dreidimensionalen Koordinaten des Mausklicks erhalten möchten, haben Sie meiner Meinung nach bereits die KameraObjekt und die Szene. Wenn Sie es nicht wissen, Sie Schauen Sie sich zunächst diese beiden Objekte an. Hier sprechen wir hauptsächlich darüber, wie man dreidimensionale Koordinaten erhält, wobei wir die Prinzipien außer Acht lassen. Obiger Code:

function onDocumentMouseDown( event ) {
  event.preventDefault();
  var vector = new THREE.Vector3();//三维坐标对象
  vector.set(
    ( event.clientX / window.innerWidth ) * 2 - 1,
    - ( event.clientY / window.innerHeight ) * 2 + 1,
    0.5 );
  vector.unproject( camera );
  var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
  var intersects = raycaster.intersectObjects(scene.children);
  if (intersects.length > 0) {
    var selected = intersects[0];//取第一个物体
    console.log("x坐标:"+selected.point.x);
    console.log("y坐标:"+selected.point.y);
    console.log("z坐标:"+selected.point.z);
  }

Was ich verstehe ist, dass der Bildschirm zweidimensionale Koordinaten empfängt, wenn die Maus klickt. Diese zweidimensionalen Koordinaten sind mit der Kamera verbunden und erstrecken sich in Richtung des Betrachtungswinkels Bilden Sie einen Strahl. Die Strahlen schneiden Objekte in der Szene und empfangen alle Objekte, die sich schneiden. Das erste Objekt ist das, das der Kamera am nächsten ist, und das letzte, das am weitesten von der Kamera entfernt ist. Im Allgemeinen wird das erste sich schneidende Objekt als Objekt verwendet, auf das mit der Maus geklickt wird.

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Beispielcodes von Three.js zum Erhalten der dreidimensionalen Koordinaten per Mausklick. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!