Saya telah terjebak selama dua minggu terakhir untuk memperbarui contoh threejs_mousepick.html dari rilis THREE.js lama ke yang sekarang. Oh ya, saya pemula dalam pemrograman.
Saya telah membuat Fiddle, melompat seseorang akan meluangkan waktu untuk membantu saya. CANNON.js adalah API yang hebat dan menyedihkan melihat bahwa contoh-contoh sudah sangat tua/tidak dapat digunakan dengan THREE.js hari ini. Saya mengerti ini banyak pekerjaan dan saya merasa ingin membantu tetapi saya butuh bantuan terlebih dahulu. Jadi, jika @schteppe Anda membaca ini, hubungi: Saya bersedia meluangkan waktu untuk mengerjakan ini.
1 menjawab
Jawabannya seluas pertanyaannya.
Penggunaan THREE.Raycaster() dan THREE.Plane() sangat menyederhanakan banyak hal. Ini memungkinkan untuk menghilangkan fungsi seperti projectOntoPlane, findNearestIntersectingObject, getRayCasterFromScreenCoord, dan memperpendek fungsi setScreenPerpCenter (namanya konyol, tapi saya membiarkannya seperti itu) untuk hanya satu baris.
jsfiddle contoh r87
gplane adalah THREE.Plane():
var gplane = new THREE.Plane(), gplaneNormal = new THREE.Vector3();
Seperti yang tertulis di komentar deskripsi, kami membuat bidang virtual, tempat kami memindahkan titik sambungan kami.
function setScreenPerpCenter(point) {
gplane.setFromNormalAndCoplanarPoint(gplaneNormal.subVectors(camera.position, point).normalize(), point);
}
Di sini, kita mengatur bidang kita dari titik normal dan coplanar, di mana normal adalah vektor pengurangan yang dinormalisasi antara posisi kamera dan titik klik pada kubus, dan titik itu adalah titik klik itu sendiri. Baca tentang metode tersebut di sini
THREE.Raycaster().