BumpMapping
基于webgl和vue2实现加深凹凸纹理和影子(内附效果图)
Install / Use
/learn @rainsilence0911/BumpMappingREADME
bumpMapping
基于webgl和vue2实现bump mapping效果和shadow mapping效果
bump mapping是一种对gpu廉价(高效)的实现凹凸纹理的算法。这个算法不需要为了凹凸效果去改变顶点坐标，所有的凹凸纹理完全在着色器内部生成
shadow mapping是一种生成舞台中元素影子的算法。
Bump Mapping效果图
不使用bump mapping的原始纹理
使用后的加深凹凸纹理(凹凸程度可调节)
Shadow Mapping效果图
画面layout
How to install
-
npm install
-
npm start
-
调整bump height，感受数学的力量
Related Skills
node-connect
348.2kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
frontend-design
108.9kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
openai-whisper-api
348.2kTranscribe audio via OpenAI Audio Transcriptions API (Whisper).
qqbot-media
348.2kQQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。
