ThreeJs webgl加载dae文件，实现线缆详细展示效果

最新推荐文章于 2024-12-25 07:32:21 发布

萧燃

最新推荐文章于 2024-12-25 07:32:21 发布

阅读量3.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： WebGL 文章标签： ThreeJs WebGL

本文链接：https://blog.youkuaiyun.com/moyeshuier/article/details/84788111

工作很多年一直没怎么写博客，最近这两年一直在开发webgl的项目，用的是threeJs，深深感觉到开源的项目社区迭代更新带来的改变，现在也贡献自己的一点点力量。

直接先展示效果

核心代码如下：


        init();

        load3dModels();

        var spriteCalcCount = 0;
        var pathTube;
        var updateMaterialOffsetArray = [];
        var updateSpriteMoveArray = [];

        //电线路径显示
        initElectricLines();

        //精灵路径显示
        initSpritePath();

        animate();

function load3dModels() {
            var loadPath = './daes/lbga/scene.dae';

            loadDae("./daes/lbga/Pdc02.DAE", { x: 12, y: 0, z: -36 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: -30 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: -24 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: -18 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: -12 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: -6 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0, z: 0 }, null, { x: -1, y: 0, z: 0 });
            loadDae("./daes/lbga/cbnt.DAE", { x: 12, y: 0,