前篇我们介绍了TWaver 3D的环境映射特效,下面我们接着给大家分享高光反射特效。
高光反射定义了物体上的某一区域比其他地方更反光。在高光反射的贴图中,黑色区域的反射率为0(完全不反光),白色区域的反射率为100%(完全反光)。这在现实的生活中,也是随处可见,比如一个生锈的物体用低光,而一个抛光的金属应该用高强光;手表上的表盘比表带应该更反光;人的嘴唇应该比皮肤有更强的高光,而皮肤应该比纯棉衣服更反光。加上了这种高光效果后,会是3D物体更加真实,更加生动。
接下来我们就来讲解一下如何在一个模型中使用高光反射,比如我们需要创建一个大楼的建筑物。一个cube贴上建筑物的贴图就可以模拟了。我们准备了一张玻璃的贴图:
创建建筑物代码如下:
var node = new mono.Cube(1000,3000,1000); node.setStyle('m.texture.image','./images/building.jpg'); node.setStyle('m.texture.repeat',new mono.Vec3(2,4));
接下来我们要准备一张高光的贴图,这张贴图上定义了哪些部分需要反射高强光,哪些部分的光照需要弱一些。
代码设置如下:
//设置需要反射的光照颜色,如果是夕阳可以设置为红色。 node.setStyle('m.specular','white'); //设置高光贴图 node.setStyle('m.specularmap.image','./images/specularmap.jpg');
然后再加上光照和skybox效果如下:
相关推荐
twaver 3D机房接口文档
TWaver 3D Flex 3D 实例 例子
TWaver是基于WebGL3D一个框架,可以使用其框架进行web3d的开发,这里贴上官方的一个小案例,可以参照使用。
twaver3d 的开发文档,对于想使用3D技术来实现模型的朋友,是一个不错的选择
TWaver HTML5 3D 制作的demo提供一个3d图形展示的基本代码。TWaver的3d图形组件库,小demo
10个TWaver网页3D可视化精彩案例.docx
twaver示例可直接放到jetty下运行,含twaver.js alarm.html资源。
我希望说点特别的东西,更有价值的东西,不只是为TWaver用户,更包括所有从事GUI开发的人和团队,提供对产品设计有借鉴意义的内容,于是我修改了提纲,精简了TWaver功能点的内容,增加了更多TWaver设计思想与产品...
TWaver-flex的库TWaver.swc
NULL 博文链接:https://bianrongxin.iteye.com/blog/1474676
TWaver是美国Serva Software公司的产品,是应用最为广泛的电信专业图形界面开发工具包,在电信行业应用非常广泛。TWaver关注于数据的图形展示,它是面向开发人员的,需要进行二次开发。 TWaver的图形组件库中提供了...
twaver for flex 开发手册
twaver-java-3.7 文档
最新的TWaver可视化学习开发包,用TWaver做出更炫更美的界面。
Twaver学习案例的例子
twaver web结合extjs源码学习资料
Twaver java开发帮助文档,英文版的。
TWaver-java的库TWaver.jar
twaver-flex-3.6.5 官方demo