threejs加载3d模型 怎样控制鼠标点击选中某个模型
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了threejs加载3d模型 怎样控制鼠标点击选中某个模型相关的知识，希望对你有一定的参考价值。
参考技术A 用鼠标右键进行选择就可以了经济实惠的可以看看雷柏的V26、罗技的G100s、雷蛇的炼狱蝰蛇等等；
高端点的可以看看罗技的G402和G502，雷柏的V910等等；
都是很不错的鼠标本回答被提问者采纳
ThreeJs之选中模型中的物体及物体沿轨迹移动
参考技术A 本案例用到的技能：1.加载模型
2.相机移动
3.鼠标选中模型
4.在场景中加入新的物体
5.物体沿路径移动
5.第一视角巡视
7.canvas画布自适应-页面窗口改变时模型不变形
首先新建react项目，引入Three，新建一个加载模型的class方法类，用于处理模型相关的操作。
主要思想是将图形组件与前端页面分离，降低图形组件与前端业务逻辑的耦合度。在图形组件中将方法暴露出来，前端页面来调用即可。
图形组件的class方法
初始化及加载模型：
渲染场景
canvas画布自适应窗口变化的方法：
鼠标选中模型的方法
// 鼠标点击时相机移动，即改变相机位置和中心点位置，以显示点击物体的最佳视角
在场景中加入一个新的立方体，并在立方体上加入相机，后面物体沿轨迹移动时调用物体身上的相机，实现以物体的视角展示模型
在场景中加入路径，物体沿着此路径移动
// 立方体沿路径移动和停止的方法，调用时执行
// 调用立方体上面的相机，展示第一视角
前端页面调用
页面中展示模型的canvas、信息div，操作按钮
实例化模型加载方法
// 鼠标移动和点击时将鼠标的位置传过去，在图形组件中转裁剪坐标，以判断是否选中物体
// 点击巡视按钮时调用立方体上的相机，并使立方体沿轨迹移动
以上是关于threejs加载3d模型 怎样控制鼠标点击选中某个模型的主要内容，如果未能解决你的问题，请参考以下文章