three.js 使用DragControls.js 拖动元素
首先,引入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 拖动元素的更多相关文章
- 【three.js练习程序】拖动选中的物体
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 关于js拖拽功能,拖拽元素的position:fixed;left:0;right:0;样式引起左右拖动元素会出现落后鼠标移动距离的问题
被拖拽元素的样式如果为:position:fixed;left:0;right:0;(当时是为了让fixed定位的元素水平居中加的left:0;right:0;避免js动态计算定位的麻烦)时左右拖动会 ...
- JS DOM 来控制HTML元素
JS DOM 来控制HTML元素 (ps:这个有很多方法,挑一些详解,嘻嘻) 1.getElementsByName():获取name. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...
- js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...
- aos.js超赞页面滚动元素动画jQuery动画库
插件描述:aos.js 是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态 ...
- 【功能代码】---5 JS通过事件隐藏显示元素
JS通过事件隐藏显示元素 在开发中,很多时候我们需要点击事件,才显示隐藏元素.那如何做到页面刚开始就把标签隐藏. 有两种方法: (1) display:none <div id=" ...
- JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性)
JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性) 以下内容: 一.获取元素的属性 二.设置元素的属性 三.删除元素的属性 一.获取元素的属性 1-原生JS 获取属性 .ge ...
- 通过JS动态的修改HTML元素的样式和增添标签元素等
一. 通过JS动态的修改HTML元素的样式 1. 要想在js中动态的修改HTML元素的样式,首先需要写document, document我们称之为文档对象,这个对象中保存了当前网页中所有的 ...
- JS高程12.2.3元素大小的学习笔记
<JavaScript高级程序设计>中讲述了通过JS如何控制页面中元素的大小,其中涉及到三对属性:偏移量,客户区大小,滚动大小.以前自己经常看到这三对属性,但是具体不是很清楚,容易混淆.所 ...
随机推荐
- flyway和liquibase的使用样例
在代码上我们有svn和git等诸多的版本控制方法. 但是在数据库上却没有相应的工具.一度导致多环境见的数据库同步难以维持. flyway和liquibase都是常见的数据库版本控制工具. flyway ...
- Resources (being shared)
论文下载求助论坛 数学杂志的模版 答辩PPT模版 发一篇文章的经历 数学期刊名称缩写 英文书籍下载 英文书籍下载 中文书籍下载 数学分析高等代数考研试题官方下载地址
- LINQ to SQL 的常见异常及解决办法
Ø 简介 本文主要介绍 LINQ to SQL 中常见的异常,以及对应的解决办法.包括以下内容: 1. 左连接情况下,右表非空类型字段可能抛出异常 1. 左连接情况下,右表非空类型字段可能抛 ...
- burp suite 基础入门超详细教程
介绍: 都是我个人了解到的信息,,分享给大家 欢迎指正 burp suite 被誉为web安全工具中的瑞士军刀. 大家知道,瑞士军刀,都是体积小,功能强悍,.西方军队的标配.说这么多,只是想强调这款工 ...
- Python3:字符串的大小写和镜像字符串(swapcase()函数,chr(),ord(),translate()函数)
题目: 请编程实现字符串的转换:1. 将"adsdsfdndsdsdfsfdsdASDSDEDSFE18754"字符串大写变小写,小写变大写:2. 并且将字符串变为镜像字符串,例如 ...
- 微信app支付的坑
app支付商户申请,需注册并认证开放平台账号后电脑端登录开放平台官网:open.weixin.qq.com,[管理中心]->[移动应用],选择需要申请支付的应用,点击[查看]->[微信支付 ...
- unicode & utf-8
简单来说: Unicode 是「字符集」 UTF-8 是「编码规则」 其中: 字符集:为每一个「字符」分配一个唯一的 ID(学名为码位 / 码点 / Code Point) 编码规则:将「码位」转换为 ...
- nslookup get public/external IP
nslookup myip.opendns.com resolver1.opendns.com Server: resolver1.opendns.comAddress: 208.67.222.222 ...
- 【原创】大数据基础之Spark(6)Spark Rdd Sort实现原理
spark 2.1.1 spark中可以通过RDD.sortBy来对分布式数据进行排序,具体是如何实现的?来看代码: org.apache.spark.rdd.RDD /** * Return thi ...
- alembic使用
前言 alembic是SQLAlchemy作者编写的控制 model 版本的模块,配合SQLAlchemy使用更佳 正文 安装 pip install alembic alembic是可以在DOS中执 ...