/dynamic

Primary LanguageJavaScript

A Cube built with Three.js

简介

此demo是由Three.js导入glb模型,通过自定义渲染器、着色器为模型添加泛光效果,并配合界面滚动事件触发“页面向下滚动时,立方体展开”的动画效果。

截图

cube

目录结构

├── assets  glb模型
├── screenshot 截图
├── src 源代码
  ├── plugins Threejs相关插件
    ├── CopyShader.js 将通道的输出结果复制到屏幕上
    ├── EffectComposer.js 效果合成器
    ├── GLTFLoader.min.js GLTF加载器
    ├── LuminosityHighPassShader.js 该着色器主要用于物体亮度通道实现
    ├── OrbitControls.min.js 轨道控制器
    ├── RenderPass.js 渲染通道
    ├── ShaderPass.js 后期处理通道
    ├── UnrealBloomPass.js 主要实现泛光效果
  ├── gsap.min.js
  ├── main.js
  ├── pixi.min.js
  ├── ScrollToPlugin.min.js
  ├── three.min.js
├── index.html