前段时间,在各大互联网平台,鸿星尔克成为了顶流般的存在。鸿星尔克官方账号更是一夜暴涨百万粉丝,直播间产品也被卖到下架,在鸿星尔克捐款的消息出现之后,在短短的几天里,鸿星尔克的销售额就超过了上半年的总销售额。 一周前,有一个程序员蓝色的秋风在GitHub开源了一个项目,用Three。js和自己训练的模型搞了一个看鞋展厅。 作者大致总结了以下几个步骤: 1。建模 2。使用Thee。js创建场景 3。导入模型 4。加入Three。js控制器 作者首先环绕着鞋子拍摄了一组照片,但是发现这个模型差强人意。 然后将背景图P成白色便好了很多: 进行到这一步,基本上的点云模型已经出来了: 作者花一天的时间训练了一个模型: 模型训练完毕,接下来便正式开发展厅了。 1。构建3d场景 首先加载Three。js,创建一个WebGL渲染器,然后再将添加一个场景和照相机,将场景和相机添加到WebGL渲染器中。 2。模型加载 直接使用Three。js写好的GLTF的loader加载模型,然后添加一束光,照亮鞋子。 3。添加控制器 到了这里只能看到鞋子,并无法通过鼠标或者手势控制,需要用到我们Three。js控制器来控制模型的角度。 这个时候我们就能从各个角度看我们的鞋子啦。 在线体验地址:resume。mdedit。onlineerke开源地址:https:github。comhua1995116360sneakersviewer