Three.js学习初探01

最新推荐文章于 2024-08-12 13:45:33 发布

Disguse

最新推荐文章于 2024-08-12 13:45:33 发布

阅读量164

点赞数

分类专栏： Three.js开发指南学习文章标签： three.js webgl

本文链接：https://blog.csdn.net/weixin_42409321/article/details/107111290

版权

在阅读《Three.js开发指南》时，发现书中代码存在一个小错误，涉及特定three.js版本的方法使用。经过调试，发现该方法在最新版本中已无法使用，需要进行修改。虽然删除这句代码对整体影响不大，但完整代码运行后，抗锯齿改进不明显，反而可能影响最终显示效果。本文将分享修复过程及运行体验。

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

用的《Three.js开发指南》这本书，书中提供的github代码有一处小错误，在github源码的36行renderer.setClearColorHex();
这个方法如果引用的three.js版本不对的话是没法用的，我用的目前最新的是直接报错的，需要改成renderer.setClearColor();
但是这句代码在源码中删掉没有太大的影响因为后面接了一个
renderer.setClearColor(new THREE.Color(0xEEEEEE));
然后是完整的代码

<!DOCTYPE html>

<html>

<head>
    <title>Example 01.02 - First Scene</title>
    <script src="../../resource/jquery-3.5.1.js"></script>
    <script src="../../resource/three.js"></script>
    <style>
        body {
   
            /* 设置页边空白和溢出页面时操作 */
            margin: 0;
            overflow: hidden;
        }
    </style>
</head>
<body>

<div id="WebGL-output">
</div>

<!-- js代码 -->
<script type="text/javascript">

    // 初始化
    function init() {
   

        // 建立一个场景来容纳 物件、相机和光线
        var scene = new THREE