threejs笔记--TubeGeometry管道

最新推荐文章于 2024-08-27 17:41:51 发布

一心诗意喂了狗

最新推荐文章于 2024-08-27 17:41:51 发布

阅读量3.2k

点赞数 1

分类专栏： threejs 文章标签： threejs

本文链接：https://blog.csdn.net/qq_33943287/article/details/89876686

版权

本文记录了使用Three.js库创建TubeGeometry管道的实践过程，详细讲解了实现方法和步骤，通过实例代码展示如何构建3D管道效果。

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


var tubeGeometry = new THREE.TubeGeometry(new 
THREE.SplineCurve3(points), segments, radius, radiusSegments, closed);

//points:   坐标点集合；
//segments： 构建管道所用的分段数 默认值为64.路径越长，指定的分段数应越多
//radius：   管道半径
//radiusSegments：   圆周的分段数，分段越多管道越圆滑
//closed:   如果设为true，管道的头尾会相连，形成闭合管道
//debug：    如果为true，额外的管道信息会添加到管道上

完整demo

<!DOCTYPE html>

<html>

<head>
    <title>Example 06.04 - Extrude TubeGeometry</title>
    <script type="text/javascript" src="../libs/three.js"></script>

    <script type="text/javascript" src="../libs/stats.js"></script>
    <script type="text/javascript" src="../libs/dat.gui.js"></script>
    <style>
        body {
    
            /* set margin to 0 and overflow to hidden, to go fullscreen */
            margin: 0;
            overflow: hidden;
        }
    </style>
</head>
<body>

<div id="Stats-output">
</div>
<!-- Div which will hold the Output -->
<div id="WebGL-output">
</div>

<!-- Javascript code that runs our Three.js examples -->
<script type="text/javascript">

    // once everything is loaded, we run our Three.js stuff.
    function init(