蹭一波圣诞节的热度,圣诞树1.0版

圣诞节要到了,准备蹭一下热度。画一颗3D的圣诞树。(好吧!这就是一颗松树,没有彩灯彩带糖果的不能叫圣诞树。)

先看效果:

还没有研究过three.js,想做个3D的树,开始也没有一个好的想法。

偶然间想起上学时候玩CS的时候(我是不是暴露年龄了),里边有些场景的树。远看是树的样子,走过去就是一张纸片。是由多角度的2D图形拼起来的。

按照这个思路来做。使用CSS3的3D样式。

大概就像翻开的书的样子,将多张2D的树复制并旋转。

(图片来自互联网)

如何画出一颗树就不再多说了。之前好几篇文章都是关于画树的了。

最简的3D树做法,画出一颗树之后,将数据复制多份,以Y轴为圆心均匀旋转。

我为了不让显得那么雷同,每张图都重新画,然后做的旋转。

这里仅提下思路,具体代码就查看演示地址源码吧。

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20171221G0VVLN00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码关注腾讯云开发者

领取腾讯云代金券