Three.js学习 - 鼠标操作三维场景（二）

引入JS:

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';

添加鼠标监听

OrbitControls.js控件支持鼠标左中右键操作和键盘方向键操作

场景操作

• 缩放：滚动—鼠标中键
• 旋转：拖动—鼠标左键
• 平移：拖动—鼠标右键

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

      controls.addEventListener('change', ()=>{

        this.renderer.render(this.scene, this.camera)

      })

注意开发中不要同时使用requestAnimationFrame()或controls.addEventListener('change', render)调用同一个函数，这样会冲突。