目录创作背景功能分解创建3d地球创建3d月球 创建3d小火箭
前言使用前端three.js加载3d模型过程中，往往会出现模型大小过大导致前端加载时间过长，降低用户体验。本文所记录的是笔者在使用gltf-pipeline压缩3d模型中踩坑DRACOLoader与解决的一个过程。所采用的three库版本为^0.138.2解决方案与介绍通过gltf-pipeline可以大幅度压缩gltf/glb模型文件。并且有如下的作用将glTF转换为glb（和反向）将缓冲区/纹理保存为嵌入或单独的文件将glTF1.0模型转换为glTF2.0（使用KHR_techniques_webgl和KHR_blend扩展）应用Draco网格压缩安装npminstall-ggltf-pi
前言使用前端three.js加载3d模型过程中，往往会出现模型大小过大导致前端加载时间过长，降低用户体验。本文所记录的是笔者在使用gltf-pipeline压缩3d模型中踩坑DRACOLoader与解决的一个过程。所采用的three库版本为^0.138.2解决方案与介绍通过gltf-pipeline可以大幅度压缩gltf/glb模型文件。并且有如下的作用将glTF转换为glb（和反向）将缓冲区/纹理保存为嵌入或单独的文件将glTF1.0模型转换为glTF2.0（使用KHR_techniques_webgl和KHR_blend扩展）应用Draco网格压缩安装npminstall-ggltf-pi
声明：本文涉及图文和模型素材仅用于个人学习、研究和欣赏，请勿二次修改、非法传播、转载、出版、商用、及进行其他获利行为。背景不知不觉，掘金关注者人数已经超过1000人，因此特地做了这个页面纪念一下，感谢大家关注?，希望博客园的粉丝也涨涨。后续也将继续努力，持续输出一些有价值的文章。本文内容涉及的技术栈为React+Three.js+Stulus，本文中主要包含的知识点包括：圆锥几何体ConeGeometry、圆柱几何体CylinderGeometry、材质捕捉纹理材质MeshMatcapMaterial、文字创建和修饰的FontLoader和TextGeometry、使用Gsap和它的插件Ph
声明：本文涉及图文和模型素材仅用于个人学习、研究和欣赏，请勿二次修改、非法传播、转载、出版、商用、及进行其他获利行为。背景不知不觉，掘金关注者人数已经超过1000人，因此特地做了这个页面纪念一下，感谢大家关注?，希望博客园的粉丝也涨涨。后续也将继续努力，持续输出一些有价值的文章。本文内容涉及的技术栈为React+Three.js+Stulus，本文中主要包含的知识点包括：圆锥几何体ConeGeometry、圆柱几何体CylinderGeometry、材质捕捉纹理材质MeshMatcapMaterial、文字创建和修饰的FontLoader和TextGeometry、使用Gsap和它的插件Ph
序： 还是要抽出时间看书的，迷上了豆豆的作品，最近在看《天幕红尘》，书中主人公的人生价值观以及修为都是让我惊为叹止。很想成为那样的人，但是再看看自己每天干的事，与时间的支配情况，真是十分的汗颜。除了为了生活所必须的工作时间外，还有大部分零散的时间不是给了短视频，就是给了短讯文章，简讯媒介，不说是毫无意义吧，但也着实是浮躁虚夸了。 用豆豆作品里的话术，"透视社会依次有三个层面：技术、制度和文化。小到一个人，大到一个国家一个民族，任何一种命运归根到底都是那种文化属性的产物"。 我终究是干技术的，还是无法洞察其中奥义，只是熟悉了几门糊口的技巧而已，究竟其本质便无所得之了，或者说依然没找到那安身立
序： 还是要抽出时间看书的，迷上了豆豆的作品，最近在看《天幕红尘》，书中主人公的人生价值观以及修为都是让我惊为叹止。很想成为那样的人，但是再看看自己每天干的事，与时间的支配情况，真是十分的汗颜。除了为了生活所必须的工作时间外，还有大部分零散的时间不是给了短视频，就是给了短讯文章，简讯媒介，不说是毫无意义吧，但也着实是浮躁虚夸了。 用豆豆作品里的话术，"透视社会依次有三个层面：技术、制度和文化。小到一个人，大到一个国家一个民族，任何一种命运归根到底都是那种文化属性的产物"。 我终究是干技术的，还是无法洞察其中奥义，只是熟悉了几门糊口的技巧而已，究竟其本质便无所得之了，或者说依然没找到那安身立
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助一、效果图具体效果可参考iview官方界面iView-一套高质量的UI组件库 大波浪效果，使用的是three.js的官方例子，需要先安装three.js支持npminstall--savethree具体可以看 three.jsexamples(threejs.org)二、代码//添加容器 //引入three.jsimport*asTHREEfrom'three'exportdefault{props:{amountX:{type:Number,default:50},amountY:{type:Number,default:50},/
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助一、效果图具体效果可参考iview官方界面iView-一套高质量的UI组件库 大波浪效果，使用的是three.js的官方例子，需要先安装three.js支持npminstall--savethree具体可以看 three.jsexamples(threejs.org)二、代码//添加容器 //引入three.jsimport*asTHREEfrom'three'exportdefault{props:{amountX:{type:Number,default:50},amountY:{type:Number,default:50},/
老子云：有道无术，术尚可求，有术无道,止于术。 咱开篇引用老子的话术，也没其它意思，只是最近学习中忽有感悟，索性就写了上来。这句话用现代辩证思维理解，这里的”道“大抵是指方法论，解决大部分问题的一般发展规律，例如学习的方法，解决问题的方法，获取知识的方法。而这里的”术“就可以理解为解决具体问题的技术，例如，一门手艺，一项专业，一个技能等。老子的意思是要掌握一般事物的发展规律...学习技术，也是一样，比如咱最近专注的3D技术，往行而上了说，道在于实践中求知的方法论，术在于熟练并应用技术的能力。而往行而下了讲，道在于3D具体执行的原理（了解掌握webgl），术则在于封装好的库的应用（了解掌握
