书架

在一些数字孪生场景特效中，常常有光环的设计。本文在 shadertoy 找了以下三个光环的实现，并解释其实现原理 |  |  | ![img](http://www.lixianglong.cn/bg_store/img/content/gif/puib6hYkibMS

所有 demo 和代码可以在 [https://www.shadertoy.com/view/X3sBR7](https://www.shadertoy.com/view/X3sBR7) 查看 在传统 3D里面，纹理都是离线制作好，结合物体的形状生成的 UV贴图。Shadertoy中我们一切都是实时生成的。也就是我们需要更具实时生成出来的形状 找到对应面的纹理坐标。 <!--more--> ## 平面映射  平面

> 这篇文章对flex不熟也可以看。这篇文章只讲这三个属性。为了简单化，不会提到主轴交叉轴，也不讲方向，默认方向就是水平方向从左往右。但并不影响对这三个概念的理解。 <!--more--> # 1.开启flex 我们正常写三个div。默认情况下是垂直排列的。只要开启flex，一行代码就可以实现水平布局。这是flex最有用的一点。 ```xml <div id="box"> <div class="div1 fontCenter">1</div> <div class="div2 fontCenter">2</div> <div cl