three.js从入门到精通系列教程016 - three.js通过OrbitControls对立方体实现旋转和缩放

最新推荐文章于 2024-08-30 19:45:00 发布

smartsmile2012

最新推荐文章于 2024-08-30 19:45:00 发布

阅读量584

点赞数 7

分类专栏： three.js从入门到精通系列教程文章标签： javascript 3D相机 three.js 数字孪生元宇宙

本文链接：https://blog.csdn.net/smartsmile2012/article/details/135714191

版权

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>three.js从入门到精通系列教程016 - three.js通过OrbitControls对立方体实现旋转和缩放</title>
    <script src="ThreeJS/three.js"></script>
    <script src="ThreeJS/jquery.js"></script>
    <script src="ThreeJS/OrbitControls.js"></script>
</head>

<body>
    <center id="myContainer"></center>
    <script>
        /*
        通过OrbitControls.js可以对Threejs 的三维场景进行缩放，平移，旋转操作，
        其本质上改变的幷不是场景，而是相机的参数。
        OrbitControls.js使用

        鼠标操作：通过拖动鼠标左键可以720旋转展示三维场景，
        通过拖动鼠标右键可以平移三维场景，通过上下滚动鼠标中键可以缩放三维场景。

        1.创建控件对象
        var control = new THREE.OrbitControls(camera);

        2.禁止使用旋转，缩放，平移
        control.enableRotate = false; //禁止旋转
        control.enablePan = false;