three.js（一）写代码做个球

最新推荐文章于 2024-06-25 17:52:54 发布

青柠可乐

最新推荐文章于 2024-06-25 17:52:54 发布

阅读量3.5k

点赞数 1

分类专栏： three.js

本文链接：https://blog.csdn.net/Wendelle/article/details/80014733

版权

最近在看three.js，每一步练习的时候用到的代码都记录一下，方便复习。第一个是最简单的球体，代码和效果如下。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Three.js</title>
    <style>
        *{
            margin:0;
            padding:0;
        }
        canvas{
            width:100%;
            height: 100%;
        }
    </style>
    <script src='https://cdn.bootcss.com/three.js/91/three.min.js'></script>
</head>
<body>
<script>
    //创建场景
    var scene=new THREE.Scene();
    //创建透视投影相机，视角45度，画幅比例 宽比高，近平面距离0.1，远平面1000
    var camera=new THREE.PerspectiveCamera(60,window.innerWidth/window.innerHeight,0.1,1000);
    //创建渲染器
    var renderer=new THREE.WebGLRenderer();
    //渲染器canvas宽高设为与窗口一致
    renderer.setSize(window.innerWidth,window.innerHeight);
    //将渲染器对应的dom元素添加到body中
    documen

最低0.47元/天解锁文章

青柠可乐

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
three.js（一）写代码做个球

最近在看three.js，每一步练习的时候用到的代码都记录一下，方便复习。第一个是最简单的球体，代码和效果如下。&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Three.js&lt;/title&gt;
复制链接

扫一扫