three.js 使用DragControls.js 拖动元素

Posted skate0rdie

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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 拖动元素的主要内容,如果未能解决你的问题,请参考以下文章

There.js入门系列之React中使用Three.js

three.js 入门详解

three.js 入门详解

Three.js实现可透视的水面效果

无法使用 three.js 渲染 GLTF 对象

使用three.js设置透明背景