threejs 限制物件只能在指定平面上拖拽

threejs提供有 DragController.js的例子来辅助拖拽

该例子可以在基于当前屏幕的x和y轴上拖拽物体,但是它不能影响z轴。

查看代码,可以在touchStart\mousedown下找到下述代码:

_plane.setFromNormalAndCoplanarPoint( _camera.getWorldDirection( _plane.normal ), _worldPosition.setFromMatrixPosition( _selected.matrixWorld ) );

  该代码的意义在于:

  1、要确定一个目标平面(_plane),物件将会在该平面上移动

2、所以,利用鼠标的clientX和clientY结合摄像机(_camera)的角度,得出向量1

3、同时,根据当前选中物件(_selected)的方向,得出向量2

4、最后,根据这两个向量来确定目标平面

所以,如果要让物件随着拖拽在纵深方向移动,只需要把这个平面修改为你期望的平面即可。比如:

    _plane.setFromNormalAndCoplanarPoint(new THREE.Vector3(0,0,1),new THREE.Vector3(0,0,1));
    

即可实现在指定平面上移动的效果,以下物件都是通过拖拽修改的初始位置:

原文地址:https://www.cnblogs.com/anrainie/p/12074458.html

时间: 2024-10-13 02:04:55

threejs 限制物件只能在指定平面上拖拽的相关文章

javascript如何指定元素的拖拽范围

javascript如何指定元素的拖拽范围:有时候拖拽效果需要限定在某一个指定的元素之内,也就是说只能够在指定的元素内进行拖拽,下面就通过一个代码实例介绍一下如何实现此效果.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/&q

如何将 ui 上拖拽上去的控件定义成我们自己的类

在MFC的开发过程中,我们经常会有这样的操作: 1.在对话框设计界面上放置一个控件,如按钮.标签.编辑框等等 2.右键选中这个控件,生成一个控件变量 3.此时查看这个控件变量的类型,是MFC的基本类型,如CButton.CStatic.CEdit等等 4.如果我们需要对控件做些个性化的改变,我们可以派生一个类,基类可以是CButton.CStatic.CEdit等等 5.此时我们只需要在头文件里将生成的控件变量改成我们派生的这个类即可,将界面上的控件改变成我们自己的类 而在Qt中,要想实现类似的

Android中如何做到自定义的广播只能有指定的app接收

今天没吊事,又去面试了,具体哪家公司就不说了,因为我在之前的blog中注明了那些家公司的名字,结果人家给我私信说我泄露他们的题目,好吧,我错了...其实当我们已经在工作的时候,我们可以在空闲的时间去面一面,因为面试有很多好处的: 第一点:你知道这个公司的具体地址了,以后和朋友说的时候也是有话题的 第二点:这点很重要,看看其他公司的面试题(现在有的公司还在采用笔试题这个环节,真心无语了,题目全是从网上找的,很没有意思,所以我只要见到有笔试题的一律pass,个人感觉面到现在,阿里和滴滴还是不错的,他

在DataWorks中实现指定UDF只能被指定账户访问

在DataWorks中实现指定资源被指定账户访问背景之前写过一篇文章是关于"DataWorks和MaxCompute内部权限体系的区别"有兴趣的朋友可以点击阅读查看详情.但是还是有些同学会问,我如何在DataWorks中实现我的具体某个Resource,Table还是UDF只能被我指定的用户所使用的权限管控.这个UDF可能涉及到数据的加解密算法,属于数据安全管控范围了. 常见方案package方案,通过打包授权进行权限精细化管控.DataWorks上新建角色(管理>MaxComp

Unity获取摄像机在某个平面上的视野范围

这是已知平面上的一个点和平面的法线的情况下,求摄像机在平面看到的视野范围,下图绿色的框框就是了. 效果: 代码: 1 using UnityEngine; 2 using System.Collections; 3 using System; 4 5 public class CameraPlaneView : MonoBehaviour 6 { 7 #region for debug 8 public Camera viewCamera; 9 10 void Update() 11 { 12

sqlserver 创建用户只能访问指定视图

use crm --当前数据库创建角色 exec sp_addrole 'rapp' --分配视图权限 GRANT SELECT  ON veiw TO [角色] --指定视图列表 GRANT SELECT ON  v_city TO rapp GRANT SELECT ON  v_lp TO rapp GRANT SELECT ON  v_qy TO rapp go --添加只允许访问指定视图的用户: exec sp_addlogin '登录名','密码','默认数据库名' exec sp_a

Problem A: 平面上的点——Point类 (III)

Description 在数学上,平面直角坐标系上的点用X轴和Y轴上的两个坐标值唯一确定.现在我们封装一个"Point类"来实现平面上的点的操作. 根据"append.cc",完成Point类的构造方法和show()方法,输出各Point对象的构造和析构次序.实现showPoint()函数. 接口描述: showPoint()函数按输出格式输出Point对象,调用Point::show()方法实现. Point::show()方法:按输出格式输出Point对象. I

POJ C程序设计进阶 编程题#4:寻找平面上的极大点

编程题#4:寻找平面上的极大点 来源: POJ (Coursera声明:在POJ上完成的习题将不会计入Coursera的最后成绩.) 注意: 总时间限制: 1000ms 内存限制: 65536kB 描述 在一个平面上,如果有两个点(x,y),(a,b),如果说(x,y)支配了(a,b),这是指x>=a,y>=b; 用图形来看就是(a,b)坐落在以(x,y)为右上角的一个无限的区域内. 给定n个点的集合,一定存在若干个点,它们不会被集合中的任何一点所支配,这些点叫做极大值点. 编程找出所有的极大

获得指定日期上一天和下一天

日期的相关操作 一: 最近项目中用到了获取指定日期的上一天和下一天 ,今天有空记录下,以便以后不时之需 二: 获得指定日期下一天 /** * 获得指定日期下一天 * @param specifiedDay * @return */ public String getSpecifiedDayAfter(String specifiedDay) { Calendar c = Calendar.getInstance(); Date date = null; try { date = new Simp