版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jianleking/article/details/53640097
three js 封装的对物体进行移动、缩放、旋转的库
property
object
- [object] default undefined
- 控制的对象
visible
- [boolean] true of false,default false
- 是否启用控制
translationSnap
----------
rotationSnap
----------
space
----------
size
----------
axis
----------
method
dispose()
----------
解绑所有事件
attach()
----------
detach()
----------
setMode(mode)
- mode[scale/rotate/translate][string]
- 设置场景编辑模式
setTranslationSnap()
----------
setRotationSnap()
----------
setSize()
----------
setSpace()
----------
update()
----------
使用方法:
1.引入库文件
<script src = 'somepath/three.js'></script>
<script src = 'somepath/transformControl.js'></script>
2.实例化
...
var camera = ...
var secen = ...
var renderer = ...
...
var transformControls = new THREE.TransformControls(camera, renderer.domElement);
scene.add(transformControls);
3.去创建一个cube试试吧
THREE常用实用插件介绍
- TransformControls.js:鼠标操控物体移动、缩放、旋转的控件(物体操作工具)[单独引入]
- EditorControls.js:鼠标操控场景视角(即场景Camera位置),模拟实现平移整个场景的控件(场景控制工具)[单独引入]
- GridHelper:网格参考系空间(模拟地平面)[three源码已嵌入]
- SpotLightHelper:显示聚光灯锥形的帮助工具(即用可视线条标识锥形范围,直观明了)[three源码已嵌入]
- stats.js:three性能检测工具类[单独引入]
- dat.gui.js:用于创建菜单栏,提供场景中的各个参数编辑功能(调试场景利器)[单独引入]