three第二天（鼠标操纵三维场景）

郭富城-

已于 2022-04-22 11:14:31 修改

阅读量167

点赞数

分类专栏： thess.js 文章标签：前端

于 2022-04-22 11:13:05 首次发布

本文链接：https://blog.csdn.net/panhao8888/article/details/124340678

版权

这篇博客详细介绍了如何在前端开发中利用JavaScript技术，结合Three.js库，实现通过鼠标交互来操纵三维场景的效果。内容包括设置场景、相机、光源，以及监听鼠标事件来改变相机视角等关键步骤。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>第一个three.js文件</title>
    <style>
        body {
   
            margin: 0;
            overflow: hidden;
            /* 隐藏body窗口区域滚动条 */
        }
    </style>
    <!--引入three.js三维引擎-->
    <script src="./three.js/build/three.js"></script>
    <script src="./three.js/examples/js/controls/OrbitControls.js"></script>
</head>

<body>
    <script>
        /**
         * 创建场景对象Scene
         */
        var scene = new THREE.Scene();
        /**
         * 创建网格模型
         */
        // var geometry = new THREE.SphereGeometry(60, 40, 40)