Как ограничить три элемента управления OrbitControls конкретным компонентом Angular2 или Div

Question

У меня есть страница с несколькими компонентами Angular2 в отдельных DIV. Одним из компонентов является сценарий THREE.js с использованием OrbitControls.

Когда я прокручиваю колесико мыши или нажимаю и перетаскиваю, 3D-модель правильно вращается и масштабируется. Однако это происходит независимо от того, где мой указатель мыши. Мне нужно иметь возможность использовать колесико мыши для прокрутки списка в другом компоненте.

Как я могу ограничить/ограничить элементы управления для сцены THREE.js своим конкретным компонентом или DIV?

Answer 1

Чтобы ограничить элементы управления для конкретного компонента или Div, сделайте @ prisoner849 упоминается - когда вы создаете OrbitControls, положить DOMElement Отображатель в качестве второго параметра:

var controls = new THREE.OrbitControls(camera, renderer.domElement)