建模
使用 贝塞尔曲线 和贝塞尔圆环实现

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_blender


曲线绘制成循环的一个侧面的形状

贝塞尔圆环使用其倒角

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_贝塞尔曲线_02


然后调整圆环大小一个杯子的形状就出来了

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_贝塞尔曲线_03


但这没有结束

要在three.js中使用的模型 只导出杯子不行 因为杯子用到了贝塞尔曲线 所以可以将杯子从贝塞尔曲线转成网格 这样只导出杯子就可以显示了

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_blender_04


至此 three.js可以显示模型

不过为了three.JS更好的性能

需要尽可能的减少模型上的点来减少three的计算

编辑模式可以看到模型的边有7千多 尽管这个模型导出也只有10几k 但为了性能还可以更小

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_建模_05


使用反细分功能可以快速减小体积

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_贝塞尔曲线_06


使用后

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_建模_07


点明显减少了 但是看起来形状并没有什么变化

经过反细分体积变得更小的 都使用平滑着色 看起来差距并不明显 但是可以减小一倍的体积

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_建模_08


对比图

blender建立一个适合three.js中使用杯子/花瓶 反细分减小体积_建模_09