首先,引入js文件:

<script type="text/javascript" src="./path/to/DragControls.js"></script>
<script type="text/javascript" src="./path/to/TransformControls.js"></script>

然后:

//实例化 TransformControls
var transformControls = new THREE.TransformControls(camera,renderer.domElement);
scene.add(transformControls); //实例化 dargControls
var dragControls = new THREE.DragControls(scene.children, camera, renderer.domElement);
dragControls.addEventListener('hoveron', function( event ){
transformControls.attach(event.object);
transformControls.setSize(0.4);
});

即可。

three.js 使用DragControls.js 拖动元素的更多相关文章

  1. 【three.js练习程序】拖动选中的物体

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 关于js拖拽功能,拖拽元素的position:fixed;left:0;right:0;样式引起左右拖动元素会出现落后鼠标移动距离的问题

    被拖拽元素的样式如果为:position:fixed;left:0;right:0;(当时是为了让fixed定位的元素水平居中加的left:0;right:0;避免js动态计算定位的麻烦)时左右拖动会 ...

  3. JS DOM 来控制HTML元素

    JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...

  4. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

  5. aos.js超赞页面滚动元素动画jQuery动画库

    插件描述:aos.js 是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态 ...

  6. 【功能代码】---5 JS通过事件隐藏显示元素

    JS通过事件隐藏显示元素 在开发中,很多时候我们需要点击事件,才显示隐藏元素.那如何做到页面刚开始就把标签隐藏. 有两种方法: (1) display:none    <div id=" ...

  7. JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性)

    JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性) 以下内容: 一.获取元素的属性 二.设置元素的属性 三.删除元素的属性 一.获取元素的属性 1-原生JS 获取属性 .ge ...

  8. 通过JS动态的修改HTML元素的样式和增添标签元素等

    一. 通过JS动态的修改HTML元素的样式   1. 要想在js中动态的修改HTML元素的样式,首先需要写document,    document我们称之为文档对象,这个对象中保存了当前网页中所有的 ...

  9. JS高程12.2.3元素大小的学习笔记

    <JavaScript高级程序设计>中讲述了通过JS如何控制页面中元素的大小,其中涉及到三对属性:偏移量,客户区大小,滚动大小.以前自己经常看到这三对属性,但是具体不是很清楚,容易混淆.所 ...

随机推荐

  1. InnoDB-MVCC与乐观锁

    最近通过<高性能MySQL>一书学习MySQL方面的知识,在看到书中所讲InnoDB-MVCC部分的时候,有一种强烈的感觉,这不就是乐观锁吗(入门级小学徒的疑惑脸)?当下便去网上以各种方式 ...

  2. oh-my-zsh安装和简单定制

    我使用的是deepin系统,deepin的终端做的已经很好了,最近想换一个新的命令的提示符风格.据说oh-my-zsh很好用,花一点时间安装,记录这个过程. oh-my-zsh的安装是非常方便的,安装 ...

  3. Python通过分页对数据进行展示

    # 通过分页对数据进行展示 """ 要求: 每页显示10条数据 让用户输入要查看的页面:页码 """ USER_LIST = [] for ...

  4. [再寄小读者之数学篇](2014-10-18 利用 Lagrange 中值定理求极限)

    试求 $$\bex \vlm{n}n^2\sex{x^\frac{1}{n}-x^\frac{1}{n+1}},\quad x>0. \eex$$ 解答: $$\beex \bea \mbox{ ...

  5. [物理学与PDEs]第1章第4节 电磁能量和电磁动量, 能量、动量守恒与转化定律 4.3 电磁能量 (动量) 密度, 电磁能量流 (动量流) 密度

    1. 电磁能量密度: $\cfrac{1}{2}\sex{\ve_0E^2+\cfrac{1}{\mu_0}B^2}$. 2. 电磁能量流密度向量: ${\bf S}=\cfrac{1}{\mu_0} ...

  6. 2.10 while循环应用

    while循环应用 1. 计算1~100的累积和(包含1和100) 参考代码如下: #encoding=utf-8 i = 1 sum = 0 while i <= 100: sum = sum ...

  7. oracle建表 和 设置主键自增

    1.新建table CREATE TABLE ysb_log( id ) primary key not null , tbdate ) NULL, tb_time ) NOT NULL, tblog ...

  8. mui弹出菜单

    详细操作见代码: <!doctype html> <html> <head> <meta charset="UTF-8"> < ...

  9. spawn-fcgi启动的一些报错问题

    spawn-fcgi启动报错 //编译生成bin文件,这里用到了fcgi和google的glog # g++ test.cpp -lfcgi -lglog -o test //运行 # spawn-f ...

  10. C语言之路-3-循环

    1.while循环计算数字位数 #include<stdio.h> int main() { ; int x; printf("请输入数字:"); scanf(&quo ...