`

TWaver3D特效之高光反射

阅读更多

前篇我们介绍了TWaver 3D的环境映射特效,下面我们接着给大家分享高光反射特效。
高光反射定义了物体上的某一区域比其他地方更反光。在高光反射的贴图中,黑色区域的反射率为0(完全不反光),白色区域的反射率为100%(完全反光)。这在现实的生活中,也是随处可见,比如一个生锈的物体用低光,而一个抛光的金属应该用高强光;手表上的表盘比表带应该更反光;人的嘴唇应该比皮肤有更强的高光,而皮肤应该比纯棉衣服更反光。加上了这种高光效果后,会是3D物体更加真实,更加生动。
接下来我们就来讲解一下如何在一个模型中使用高光反射,比如我们需要创建一个大楼的建筑物。一个cube贴上建筑物的贴图就可以模拟了。我们准备了一张玻璃的贴图:
building4
创建建筑物代码如下:

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));

 接下来我们要准备一张高光的贴图,这张贴图上定义了哪些部分需要反射高强光,哪些部分的光照需要弱一些。

building3-spe

代码设置如下:

//设置需要反射的光照颜色,如果是夕阳可以设置为红色。
node.setStyle('m.specular','white');
//设置高光贴图
node.setStyle('m.specularmap.image','./images/specularmap.jpg');

 然后再加上光照和skybox效果如下:

building

分享到:
评论

相关推荐

    基于TWaver实现的3D机房Demo

    【基于TWaver实现的3D机房Demo】 在IT行业中,3D可视化技术正在逐步渗透到各个领域,尤其是在数据中心管理方面。TWaver是一款强大的WebGL3D框架,它为开发者提供了一个高效、灵活的工具,用于创建交互式的3D应用...

    TWaver的3d图形组件库,小demo

    4. **3D图形组件**:TWaver提供的3D图形组件包括但不限于3D图表(如3D柱状图、3D饼图)、3D网络图、3D空间布局等,可用于数据可视化和复杂的场景模拟。 5. **基本代码示例**:压缩包中的"twaver"文件可能包含一个或...

    TWaver 3D Flex 3D 实例 例子

    标题中的“TWaver 3D Flex 3D 实例 例子”表明这是一份关于TWaver 3D技术在Flex 3D环境下的应用实例。TWaver是一款强大的数据可视化工具,它提供了丰富的图表类型和交互功能,而Flex 3D是Adobe Flex框架的一个扩展,...

    twaver 3D机房接口文档

    ### 3D机房系统接口文档关键知识点 ...通过以上介绍可以看出,《twaver 3D机房接口文档》详细描述了3D机房系统的关键功能模块及其接口设计,旨在帮助开发者更好地理解并利用这些接口来实现机房管理自动化和智能化。

    twaverflex 3D开发文档

    文档开头提到了“TWaver3D for Flex Developer Guide Version 3.0”,这意味着文档是TWaver3D版本3.0的开发者指南,用于指导开发者如何使用TWaver3D进行Flex应用开发。TWaver3D是一个专门针对Adobe Flex开发环境的3D...

    10个TWaver网页3D可视化精彩案例.docx

    #### 四、3D拓扑图之花团锦簇 & 人在江湖 **知识点概述:** 这两款案例均采用了立体拓扑图的形式,分别展现了美丽的3D小球花和复杂的人际关系网络。通过简洁明快的设计,TWaver将抽象的概念具象化,帮助用户更好地...

    TWaver图形界面之道

    ### TWaver图形界面之道——关键知识点解析 #### 一、TWaver概述 TWaver是一款专为图形用户界面(GUI)开发而设计的组件产品。它不仅适用于电信行业的网络管理系统(NMS),同样适用于非电信领域的各类图形化界面...

    twaver.js使用示例

    ”这说明提供的示例不仅包含核心的twaver.js库,还有与之配合的HTML文件“alarm.html”。Jetty是一个轻量级的Java Web服务器和Servlet容器,能够方便地运行Web应用程序。这意味着用户可以直接在Jetty环境下运行这个...

    twaver-html5-5.9.0-api_html5_-5.9.0-api_twaver_

    Twaver是一个强大的数据可视化和网络建模工具,广泛应用于网络拓扑、流程图、组织结构等场景。5.9.0是该库的一个特定版本,可能包含了新功能、性能优化或错误修复。 描述简单明了,"twaver-html5-5.9.0-api"直接...

    TWaver 源代码下载 案例

    TWaver 源代码下载 3D 机房代码下载 TWaver 编辑器下载

    flex Twaver组件使用

    此外,TWaver Flex还预定义了丰富的业务对象,如告警(`twaver.IAlarm`)和告警容器(`twaver.AlarmBox`),图层(`twaver.ILayer`)和图层管理容器(`twaver.LayerBox`),以及拓扑网元(`twaver.IElement`)和拓扑...

    TWaver-java-4.1最新 官网试用版jar包及Demo

    【标题】"TWaver-java-4.1最新 官网试用版jar包及Demo" 涉及的核心知识点是TWaver,一个基于Java的图形可视化库,主要用于数据的图表展示和交互。这个版本是4.1,是官方提供的试用版,包含jar包和演示示例。 【描述...

    Twaver-html5.zip

    Twaver学习案例的例子

    TWaver HTML5 开发指南代码

    TWaver是一个强大的可视化框架,其核心特性是支持复杂的图形和网络图表的绘制,尤其适合在Web上创建交互式的机房、网络设备、服务器架构等展示。 一、TWaver概述 TWaver是一个高效且灵活的JavaScript库,专门用于...

    twaver-java-4.1

    【标题】"TWaver-java-4.1" 是一个针对Java平台的TWaver最新开发包,旨在帮助开发者创建更加生动且具有吸引力的用户界面。TWaver是一个强大的数据可视化工具,它提供了丰富的图表类型和交互功能,让数据展示更加直观...

    Twaver 3.7性能测试报告

    ### Twaver 3.7性能测试报告分析 #### 概述 Twaver是一款由Serva Software开发的强大软件工具,主要用于支持复杂网络环境中的数据管理和处理。本次报告主要针对Twaver Java版本(Twaver Java)在不同节点配置及连接...

    TWaver文档

    - **界面交互**也是TWaver的重要组成部分之一,它提供了丰富的API来处理用户的输入事件,并且可以根据用户的操作实时更新视图。 ### 产品家族与技术栈 - TWaver支持多种技术和平台,包括**Java**、**Flex**、**...

    twaver web实例源码

    【标题】"Twaver Web实例源码"是一个关于使用Twaver与ExtJS结合的Web应用程序开发的学习资源。Twaver是一款强大的图形化建模和可视化工具,常用于数据可视化、网络拓扑图、流程图等场景。ExtJS则是一个流行的...

    twaver-java-3.7

    **标题:“twaver-java-3.7”** **描述:“twaver-java-3.7 文档”** **标签:“twaver java 3.7”** 本文将深入探讨Twaver Java 3.7版本的相关知识,这是一个强大的数据可视化库,特别适用于Java开发人员。...

Global site tag (gtag.js) - Google Analytics