首先,引入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. oldboy s21day06

    #!/usr/bin/env python# -*- coding:utf-8 -*- # 1.列举你了解的字典中的功能(字典独有).'''dic.keys() 获取所有keydic.values() ...

  2. [再寄小读者之数学篇](2014-06-22 积分不等式 [中国科学技术大学2012年高等数学B考研试题])

    函数 $f(x)$ 在 $[0,1]$ 上单调减, 证明: 对于任何 $\al\in (0,1)$, $$\bex \int_0^\al f(x)\rd x\geq \al \int_0^1 f(x) ...

  3. [译]Ocelot - Configuration

    原文 这里有一个配置的样例.配置主要有两个部分.一个是ReRoutes数组,另一个是GlobalConfiguration.ReRoute告诉Ocelot怎么处理上游的请求.Global config ...

  4. Best Practice API

    # 建议直接使用的第三方类 Common Lang =>StringUtils =>Validate Guava =>Cache =>Ordering JDK7(LTS JDK ...

  5. 【Java】Java随手记

    System.out.printf() : System.out.printf("%d",x);               输出整数 System.out.printf(&quo ...

  6. 找不多控件, or 控件为null

    组件化开发,命名要使用moudle区分, 同名,在最后合成的时候,会出现很多问题,

  7. DeepLearning.ai学习笔记(五)序列模型 -- week2 自然语言处理与词嵌入

    一.词汇表征 首先回顾一下之前介绍的单词表示方法,即one hot表示法. 如下图示,"Man"这个单词可以用 \(O_{5391}\) 表示,其中O表示One_hot.其他单词同 ...

  8. 第七节,Python的可视化包——matplotlib

    1.2D图表 import numpy as np import matplotlib as mpl import matplotlib.pyplot as plt # 通过rcParams设置全局横 ...

  9. underscore用法大全

    1._.find函数 var one = _.find(all, function (item) { return item.C_ID == selected; }); $('#C_NAME').va ...

  10. matplotlib中的plt.ion()和plt.ioff()函数

    转自https://blog.csdn.net/yzy__zju/article/details/85008603 Matplotlib的显示模式默认为阻塞(block)模式,因此若想动态显示图像,则 ...