three.js добавить кнопку на объект для отображения информации об этом месте

Question

У меня есть объект, загруженный загрузчиком GLTF на мою сцену:

        var loader = new THREE.GLTFLoader();
        loader.load( 'files/3.gltf', function ( gltf ) {

            gltf.scene.traverse( function ( child ) {

Мне нужно создать точку на этом объекте для отображения всплывающей информации.

Как добавить точкув спецификацию местоположения на объекте?

Answer 1

Вы можете добавить невидимый куб / сферу с помощью онлайн-редактора three.js. https://threejs.org/editor/, Поместите его в нужное место, добавьте данные пользователя к этому объекту, например, raycast: true, экспортируйте в gltf, затем добавьте элемент в массивraycastable элементы

gltf.scene.traverse( function ( child ) {
    if(child.userData.raycast) raycastable.push(child);
})

Затем проверьте пересечение в цикле рендеринга https://threejs.org/docs/#api/en/core/Raycaster

Answer 2

Есть два пути для этого.
1. Вы можете добавить Button с помощью программного обеспечения, из которого вы получаете этот объект.
2. Вы можете создать отдельную пользовательскую кнопку / объект в самом файле THREE.js и поместить его на сцену с объектом GLTF.

Спасибо