JavaScript: Вывести в браузер glTF модель с иерархией (через Three.js)
Есть модель этажа здания в формате glTF (прикладываю).
Нужно пользуясь движком Three.js вывести эту модель на страничку (с возможностью мышкой крутить туда-сюда и приближать-отдалять). Слева от модели нужно любым компонентом для отрисовки деревьев нарисовать иерархию этой модели (в файле модели уже содержатся нормальные названия всех объектов и отношения parent-child между ними).
Далее, кликаем на элементе дерева объектов - подсвечивается соответствующий объект в 3D-виде. И наоборот, кликаем на объект на 3D-виде, подсвечивается соответствующий объект в дереве объектов.
Вот как загружать формат glTF в Three.js:
https://github.com/mrdoob/three.js/blob/master/examples/webgl_loader_gltf.html
Как подсвечивать объекты под мышкой:
https://threejs.org/examples/#webgl_interactive_cubes
Вот в этой статье посередине есть код, который позволяет строить иерархию объектов из glTF:
https://threejsfundamentals.org/threejs/lessons/threejs-load-gltf.html
По идее, задача решается в пару-тройку страничек кода, если вы раньше с Three.js работали.