EN中文

地球信息科学学报 >

2015 , Vol. 17 >Issue 1: 31 - 36

DOI: https://doi.org/10.3724/SP.J.1047.2014.00031

三维地形颜色渐变渲染的光滑过渡方法研究

  • 韩李涛 , 1, 2, * ,
  • 范克楠 1
展开
  • 1. 山东科技大学 测绘科学与工程学院,青岛 266590
  • 2. 海岛(礁)测绘技术国家测绘地理信息局重点实验室,青岛 266590

作者简介：韩李涛(1978-),男,博士,副教授,研究方向为虚拟地理环境和空间信息可视化。E-mail:

收稿日期: 2014-03-25

  要求修回日期: 2014-05-12

  网络出版日期: 2014-01-09

基金资助

国家自然科学基金项目(41201381、41376108)

山东省“泰山学者”建设工程专项经费资助

海岛（礁）测绘技术国家测绘地理信息局重点实验室资助项目(2012A04)

收起

Research on Smooth Transition of Color Rendering for 3D Terrain

  • HAN Litao , 1, 2, * ,
  • FAN Kenan 1
Expand
  • 1. Geomatics College, Shandong University of Science and Technology, Qingdao 266590, China
  • 2. Key Laboratory of Surveying and Mapping Technology on Island and Reed, NASMG, Qingdao 266590, China
*Corresponding author: HAN Litao, E-mail:

Received date: 2014-03-25

  Request revised date: 2014-05-12

  Online published: 2014-01-09

Copyright

《地球信息科学学报》编辑部 所有
Fold

摘要

地形颜色渐变渲染是表达地形起伏变化或其他地学要素空间分布变化趋势的常用方法。在三维地学交互分析系统中观察分析三维地学信息时,需要依据观察位置和分析区域的范围大小不停地变化视角和视距。当观察距离很近时,利用包含一定颜色数的色带渲染地形会出现明显的颜色分层现象,不能很好地表达地形颜色的光滑过渡。针对三维地学交互分析系统对地形颜色渐变渲染的操作需求和存在的问题,分析了RGB和HSL两种颜色模型的特点,顾及OpenGL的颜色平滑过渡原理,在RGB颜色空间通过对所有颜色分量进行线性插值实现了地形双色渐变渲染,在HSL颜色空间通过固定饱和度、亮度,对色相进行线性插值实现了地形多色渐变渲染,并通过加入光照计算来增强地形颜色渐变晕渲的三维立体效果。实验结果表明：本文方法能很好地兼容OpenGL的平滑着色,实现三维交互环境下任意距离观察地形均能保持颜色之间光滑渐进过渡,达到更为光滑的地形颜色渐变渲染效果。

关键词： 地形可视化; 颜色模型; 颜色渐变; 光照计算

本文引用格式

韩李涛 , 范克楠 . 三维地形颜色渐变渲染的光滑过渡方法研究[J]. 地球信息科学学报, 2015 , 17(1) : 31 -36 . DOI: 10.3724/SP.J.1047.2014.00031

Abstract

Terrain rendering using gradient color is a common way to express spatial distribution and change of topography or other geological factors. Observation and analysis of geological information in the three-dimensional interactive analysis system require users to change the visual angle and distance of the sight according to the observation location and the extent of the analysis area. When the observation distance is very close, an obvious stratification phenomenon will appear when using a color ribbon of selected colors to render terrain, which is unable to express perfectly the smooth transition effect of terrain color rendering. For operation requirements and to overcome existed problems of terrain gradient color rendering in the three dimensional geological interactive system, this paper analyzes characteristics of two color models: RGB and HSL. Combined with the color smooth transition principle of OpenGL, double-color gradient rendering for terrain is realized through interpolating linearly every color component in the RGB color space respectively. And multi-color gradient rendering is achieved for terrain through interpolating hue linearly and fixing saturation and lightness in the color space HSL. In addition, lighting calculation is proposed to be added to enhance the three-dimensional effect of color gradient shaded terrain. At last, a piece of terrain is selected to test the above methods. The rendered effects of the terrain using the double-color gradient interpolation, the multi-color gradient interpolation and a color ramp with 30 colors are compared with each other. Experimental results show that these methods can provide better compatibility with smooth shading algorithms of the OpenGL library, keep smooth gradual transition between colors in a three-dimensional interactive environment when observing the terrain from any distance, and achieve smoother color gradient rendering for the terrain.

Key words： terrain visualization; color model; color gradient; lighting computation

1 引言

一直以来,等高线、分层设色、二维晕渲等是地图上表达地形和分析的主要形式。然而,这些形式在信息表达的直观性、地形分析的方便性,以及相关产品衍生方面都存在着局限性。随着计算机图形学和三维GIS的发展,以逼真三维表达为主、二维表达为辅的地形表达方式已成为地形表达的主流。除了通过叠加纹理形式获取逼真的三维地形景观表达外,也常常利用渐变颜色渲染三维地形来表达高程或其他地学要素随空间位置变化而变化的情况[1-3]。
地貌晕渲属于地形颜色渐变渲染的一种[4-11]。在地貌晕渲图制作过程中,若不断放大地形显示,由于色阶数和地形分辨率的限制,在颜色变化部分会产生非平滑过渡[12-15]。另外,随着三维可视化应用系统的快速发展和普及,系统要求提供更高分辨率更为细腻的可视化效果,而现有许多三维交互可视化系统还不具备任意分辨率下颜色渲染的无级平滑过渡,即当观察目标放大到一定程度时,颜色之间的变化呈不光滑过渡[16]。本文基于不同颜色模型设计了地形双色、多色渐变渲染方法,并通过加入光照计算增强地形颜色渐变的三维立体晕渲效果。

2 颜色模型选择

颜色模型和色带设计是地形颜色渐变渲染的基础。在计算机图形学和图像处理领域主要有RGB和HSL两种颜色模型[17-18]。RGB模型是OpenGL支持的主要颜色模式之一。然而,RGB颜色模型的3个颜色分量并不能很好地反映人类视觉感知颜色的规律,无法方便地反映人眼对色相、饱和度和亮度等颜色特性变化的感知。若要表示色相按光谱顺序连续变化的颜色带,如红、橙、黄、绿、青、蓝、紫,RGB模型需要R、G、B 3个分量分别参与变化,变化规律复杂,而HSL模型只需要线性变化H分量就可以实现。因此,多色渐变采用HSL模型设定色带。由于OpenGL不支持HSL颜色模型,所以,要利用HSL模型实现地形多色渐变,需要先实现HSL模型和RGB模型的相互转换。
（1）RGB到HSL的转换过程[19]：设r、g、b分别代表RGB颜色空间一个颜色的红、绿和蓝颜色分量,且r、g、b∈[0,1];h、s、l分别是该颜色对应HSL空间中颜色的色相、饱和度、亮度3个分量,且h∈[0,360）,s、l∈[0,1]。若max、min分别取r、g、b的最大值和最小值,则由（r,g,b）到（h,s,l）的转换公式如下：
h = 0 ∘ , max = min 60 ∘ × g - b max - min + 0 ∘ , max = r 和 g ≥ b 60 ∘ × g - b max - min + 360 ∘ , max = r 和 g < b 60 ∘ × b - r max - min + 120 ∘ , max = g 60 ∘ × r - g max - min + 240 ∘ , max = b （1）
l = 1 2 ( max + min ) （2）
s = max - min 2 - ( max + min ) = max - min 2 - 2 l , l > 1 2 0 , l = 0 或 max = min max - min max + min = max - min 2 l , 0 < l ≤ 1 2 （3）
h通常需要规范化到区间[0,360°）,h=0（即max=min）表示颜色在RGB空间的3个颜色分量r、g、b相等,也就是灰色。
（2）HSL到RGB的转换过程[19]：设h、s、l、r、g、b代表的意义和取值范围同上。首先需要判断s的值：若s=0,则表示颜色是灰色的,此时r、g、b三者相互之间比值为1,注意h的值在这种情况下是未定义的;若s≠0,则转换过程按如下步骤进行：
① 引入q、p、hk 3个中间辅助变量,按式（4）、（5）、（6）计算各个辅助变量的值。式（6）的作用是将h换算到[0,1)区间。
q = l × ( 1 + s ) , l < 1 2 l + s - ( l × s ) , l ≥ 1 2 （4）
p = 2 × l - q （5）
h k = h 360 （6）
② 引入tr、tg、tb 3个中间辅助变量,它们的值首先由式（7）确定,然后依据第③步进行处理。
t r = h k + 1 3 t g = h k t b = h k - 1 3 （7）
③ 设tc代表tr、tg、tb中的任何一个。首先,判断tc的值：若 t c < 0,则 t c = t c + 1 ;若 t c > 1 ,则 t c = t c - 1 。然后,由式（8）计算tc的值。
t c = p + ( ( q - p ) × 6 × t c , 0 ≤ t c < 1 6 q , 1 6 ≤ t c < 1 2 p + ( q - p ) × 6 × 2 3 - t c , 1 2 ≤ t c < 2 3 p , 2 3 ≤ t c ≤ 1 （8）
利用上述步骤计算出来的tr、tg、tb即分别代表颜色在RGB空间的红、绿、蓝分量。注意,这里tr、tg、tb的值都在0到1之间。
颜色渐变渲染一般采用较为醒目的颜色带,因此,在HSL模式下一般取饱和度为1.0,亮度为0.5。此时,若把“红、橙、黄、绿、青、蓝、紫”色环分为6个区间,由式（1）-（8）分析可知,在RGB模式下色环上不同颜色区间颜色分量的变化规律如表1所示。
Tab. 1 Changes of color components in color ring under RGB mode

表1 RGB模式下色环上颜色分量的变化

颜色分区 R分量 G分量 B分量
红到黄 1.0 0.0-1.0 0.0
黄到绿 1.0-0.0 1.0 0.0
绿到青 0.0 1.0 0.0-1.0
青到蓝 0.0 1.0-0.0 1.0
蓝到洋红 0.0-1.0 0.0 1.0
洋红到红 1.0 0.0 1.0-0.0
由表1可知,在每一个颜色分区内都仅仅涉及R、G、B分量中的2个颜色分量起作用（第3个分量为0）,颜色变化随其中一个分量的变化而线性变化。因此,对于双色渐变,若色带的首末端颜色处于同一个颜色分区内,RGB模式下对其变化的分量进行线性插值与HSL模式下对色相进行线性插值,颜色渐变效果是等同,如红到黄;否则,两者渐变效果则明显不同,如红到青,效果见表2。因此,双色渐变基于RGB模型,通过对3个分量分别线性插值实现。
Tab. 2 Color gradient effect based on different color models

表2 不同颜色模型下的颜色渐变效果

颜色模式 色带 首、末端颜色值
HSL 红（0.0,1.0, 0.5）到黄（120, 1.0, 0.5）
RGB 红（1.0, 0.0, 0.0）到黄（1.0, 1.0, 0.0）
HSL 红（0.0, 1.0, 0.5）到青（180, 1.0, 0.5）
RGB 红（1.0, 0.0, 0.0）到青（0.0, 1.0, 1.0）

3 三维地形颜色渐变渲染方法

地形渐变色渲染利用颜色的连续渐进过渡来表达地形高程变化的连续性、非突变性,色带设置和颜色渐变插值是2个关键问题。结合地形渐变色表达的需求,本文研究和实现了地形双色渐变和地形多色渐变。

3.1 地形双色渐变

地形双色渐变是分别设定地形最高点和最低点对应的颜色,然后依据高程变化对中间任一高程点进行颜色插值。由于无论格网DEM还是不规则三角网TIN,在进行三维绘制时一般都是采用三角形图元进行绘制,三角形顶点的颜色和渲染模式决定着地形最终的颜色渲染效果。因此,这里涉及2个颜色插值过程：（1）依据高程不同,实现双色渐变色带到三角网中每个顶点的颜色映射;（2）由三角形每个顶点的颜色插值获得三角形面上的任意一点颜色。
在顶点光滑着色GL_SMOOTH模式下,OpenGL对不同颜色顶点的颜色平滑过渡是通过在RGB模式下对R、G、B 3个分量分别做线性均匀内插实现的[20]。对于直线图元,OpenGL会用直线2个端点的颜色进行均匀插值;对于三角形面则是采用3个角点的颜色做均匀插值。因此,为了使2个颜色插值计算过程保持一致,从而获取更好的平滑渲染效果,双色渐变色带到每个顶点映射也是在RGB模式下通过对R、G、B 3个颜色分量分别进行线性内插获得。设地形最大高程值为Zmax,对应颜色为ColorMax(Rmax, Gmax, Bmax),最小高程值为Zmin,对应颜色为ColorMin(Rmax, Gmax, Bmax),则在Zmax不等于Zmin时,高程为Z的顶点颜色Color(R, G, B)的计算公式如下：
R = R max - R min Z max - Z min ( Z - Z min ) + R min G = G max - G min Z max - Z min ( Z - Z min ) + G min B = B max - B min Z max - Z min ( Z - Z min ) + B min （9）
式中,Zmin≤Z≤Zmax。
地形双色渐变实现的具体步骤为：
（1）设定双色渐变色带的两端颜色,即最高高程点对应颜色和最低高程点对应颜色;
（2）读取高程数据,获取最大高程值Zmax和最小高程值Zmin;
（3）若Zmax等于Zmin,则地形平坦,不进行渐变色渲染;否则调用公式（9）进行线性插值颜色。

3.2 地形多色渐变

为了更丰富细致地表达地形地貌的变化特征,地形颜色渲染常采用多色渐变。在制作地貌晕渲图时,若既要保证颜色过渡的平滑又让颜色符合人们对地貌形态的认知习惯,一般需要人工设计至少包含几十个颜色的色阶表,过程繁琐且只能在较小显示分辨率下达到很好的晕渲效果[5-9]。
针对上述问题,本文通过对HSL颜色模型的色相分量H进行线性插值来实现地形多色渐变渲染。在HSL颜色空间,当亮度L和饱和度S固定时,若线性增加H分量,将会获得红、橙、黄、绿、青、蓝、紫依次循环渐变的效果,从而形成多色平滑渐变。随着亮度增高,会导致颜色趋向于白色,而亮度降低颜色会趋向于黑色,因此,亮度一般取值为0.5;饱和度反映了颜色的纯度,为了使颜色效果更为纯正,一般取值为1.0。在HSL颜色空间,设地形最大高程值为Zmax,对应颜色为ColorMax(Hmax, Lmax, Smax),最小高程值为Zmin,对应颜色为ColorMin(Hmin, Lmin, Smin),则在Zmax不等于Zmin时,高程为Z的顶点颜色Color(H, L, S)的计算公式为：
H = H max - H min Z max - Z min ( Z - Z min ) + H min L = L max = L min ; S = S max = S min （10）
式中,Zmin≤Z≤Zmax。
在算法实现时,为了便于设置色带,色带的色相范围由初始色相H0和色相长度Hrange代替色相最大最小值来确定。其转换关系为：
H min = H 0 H max = H min + H range （11）
这里,色相H的范围是[0, 360)。因此,利用式（10）计算的H需要变换到该有效范围内,才能作为顶点的有效HSL模式颜色。
多色渐变算法基本思路为：
（1）在HSL空间设定饱和度、亮度,以及色相的初始值H0和范围Hrange;
（2）保持饱和度和亮度值不变,将色相依据高程变化通过线性内插方式映射到需要渲染的地形上,获得三角形每个顶点的HSL颜色值;
（3）将每个顶点的HSL颜色值转换到RGB颜色空间,获取三角形每个顶点RGB颜色值;
（4）在RGB颜色空间,利用OpenGL提供的颜色光滑过渡模式GL_SMOOTH对颜色进行线性内插。
为了渲染出三维立体效果,需要加入光照计算。OpenGL光照计算属于简单光照模型,并通过Gouraud明暗处理进行亮度插值。格网DEM属于一种边形网格,光照计算前需要先计算各个顶点的法线,详见文献[21]。为了避免光源颜色给渐变色带渲染带来的影响,系统只加入了一个方向光源,且设定光源的环境光、漫反射、镜面反射分别为：GLfloat light_ambient[] = {0.5, 0.5, 0.5, 1.0}; GLfloat light_diffuse[] = {1.0, 1.0, 1.0, 1.0}; GLfloat light_ specular[] = {1.0, 1.0, 1.0, 1.0}。光源位置参数lightPos由用户根据场景效果利用交互界面随时调整。另外,因为OpenGL在光照模式下glColor*()函数将失去作用,因此,需要设置glEnable(GL_COLOR_MATERIAL)启动颜色材质模式。详细的算法流程图如图1所示。
Fig. 1 Chart of multi-color gradient rendering for terrain

图1 地形多色渐变渲染算法的流程图

4 地形光滑过渡渲染的实验分析

为验证方法的正确性和地形渐变渲染的效果,利用VC++6.0及OpenGL三维图形库开发了地形颜色渐变渲染实验平台LarTerrain,并应用于多波束数据可视化分析与海底地形可视化。DEM采用规则格网形式进行表达,可以直接读取Surfer的.grd格网文件和国家标准空间数据交换格式.DEM文件。系统提供了3种颜色渲染模式：单色模式、双色渐变、HSL多色渐变。
色带包含的色价数是影响地形颜色渲染效果的重要因素。手工设置色带一般颜色数在十几到几十个。在渲染地形时,若某个三角形3个顶点的高差较小,则色带包含颜色数较少时,三角形的3个顶点可能会被映射为同一颜色,这时该三角形面的微小高度变化就不能通过颜色变化反映出来。本文采用线性插值函数计算色带中间任意位置的颜色,实现色带颜色连续渐变,地形渲染时就可以给任意高程不同的点映射出不同的颜色。因此,相比于手工设置色带,颜色连续插值方法不仅避免了繁琐费时的色带设置,而且获得渐变过渡效果更光滑。为了比对渲染效果,以某起伏地形为实验区分别采用包含30个颜色的色带、双色连续插值,以及多色连续插值进行地形渐变渲染（图2）。为避免光照对颜色插值效果的影响,此时没有加入任何光照。
Fig. 2 Shading effect of three methods without lighting

图2 无光照模式下3种方法渲染后的观察效果

从图2可知,用30色色带渲染时,处于同一高程带的许多顶点被赋予相同的颜色,地形渲染分层现象明显,当放大图形近距离观察时分层更加明显,甚至可以观察到在两层过渡衔接处出现了明显的锯齿现象;双色连续插值渐变和多色连续插值渐变实现的地形颜色渐变渲染效果非常平滑,且与观察距离几乎没有关系。这使得用户在操作三维图形系统时,任意距离缩放地形进行观察都能够获取平滑的地形颜色渐变渲染效果。
图3显示了加入光照计算并设定合适光源位置后的效果对比,加入光照计算使得地形渲染的立体感明显增加。当远距离全局观察时,光照在一定程度上模糊了色带之间的分层非连续过渡,30色色带渲染地形效果和连续插值方法效果接近。当放大地形进行局部观察时,30色色带渲染产生的分层过渡现象比较明显,双色连续插值和多色连续插值渲染地形的效果仍然保持连续光滑过渡。
Fig. 3 Shading effect of three methods with lighting

图3 光照模式下3种方法渲染后的观察效果

5 结论

地形颜色渐变渲染效果与地形网格单元大小、渲染色带设计,以及颜色与高程之间的插值映射方法密切相关。结合OpenGL的颜色平滑过渡原理和RGB、HSL两种颜色模型的特点,提出基于RGB模型的双色渐变线性插值方法和基于HSL模型的多色渐变线性插值方法,实现了地形颜色渐变渲染在任意分辨率下,都可保证颜色之间的平滑过渡,达到更为光滑的地形颜色渐变渲染效果,提升了三维系统的地形颜色渐变渲染能力。本文仅实验了固定饱和度与亮度,线性插值色相获取多色渐变,为了获取更为丰富多彩的渐变色带,同样可以固定色相而对饱和度或亮度进行插值。该方法对医学、气象、海洋、地质,以及地理等领域的数据场可视化具有一定的启发意义。

The authors have declared that no competing interests exist.

参考文献

原文顺序 | 文献年度倒序 | 文中引用次数倒序
[1]
郭礼珍,李霖,张园玉.基于视觉表象的彩色晕渲地图色彩设计[J].武汉大学学报(信息科学版),2004,29(6):492-495.

[2]
张志华,侯恩科,马露.基于OpenGL的三维模型渲染方法研究[J].中国矿业,2011,20(2):114-117.

[3]
陈望婷,朱庆.地形三维可视化中的彩色地貌晕渲图多模式色彩设计[J].测绘信息与工程,2006,31(6):47-49.

[4]
赵尚民,程维明,周成虎,等.计算机环境下地貌晕渲图制作的探讨[J].地球信息科学学报,2009,11(6):795-800.

[5]
何宗宜,刘祥,魏秀琴.基于DEM的彩色地貌晕渲的制作[J].测绘科学,2006,31(6):137-142.

[6]
甘昱,庞小平,李雪梅. 大比例尺彩色地貌晕渲图的生成技术[J]. 测绘通报,2005(11):58-62.

[7]
江文萍,毋河海,杜清运,等.大型彩色地貌晕渲的自动生成技术研究[J].武汉大学学报(信息科学版),2004,29(6):496-499.

[8]
郭明武,吴凡,黄宇,等. 工程化数字地貌自动晕渲系统的设计与实现[J]. 测绘通报,2006(10):16-19.

[9]
陈张建,陈张建,陈锁忠,茅晶晶.基于等值线分布区域树的分层设色图自动生成研究[J].地理与地理信息科学,2007,23(3):47-50.

[10]
魏金桃,方强飞,齐永刚.三维海底晕渲图绘制方法探究[J].海洋测绘,2013,33(1):60-62

[11]
吴玉清. 地图制图中地貌晕渲实现技术的研究[D].北京:中国测绘科学研究院,2010.

[12]
余建伟,朱海红,姜文亮,等.基于熵的彩色晕渲图设色方案辅助设计[J].武汉大学学报(信息科学版),2008,33(3):302-305

[13]
姜文亮,李霖,应申.计算机地貌晕渲效果增强方法研究[J].武汉大学学报(信息科学版),2007,32(12):1116-1118.

[14]
Zhou Z K, Wang J, Zhao H C. Efficient data-parallel algorithm for elevation color generation in terrain rendering[J]. Applied Mechanics and Materials, 2012,155-156:37-41.

[15]
Livny Y, Sokolovsky N, Grinshpoun T, et al.A GPU persistent grid mapping for terrain rendering[J]. Visual Computer, 2008,24:139-153.

[16]
Milicich S D, Bardsley C, Bignall G, et al.3-D interpretative modeling applied to the geology of the kawerau geothermal system[J]. Geothermics, 2014,51:344-350.

[17]
李宋,吴文权,詹咏.颜色渐变的方法研究[J].上海理工大学学报,2004,26(3):224-228.

[18]
范克楠. 大规模海底地形可视化关键技术研究[D].青岛:山东科技大学,2013.

[19]
孙家广. 计算机图形学(第三版)[M].北京:清华大学出版社,2001:510-521.

[20]
Dave S, 李军,徐波,等译.OpenGL编程指南[M].北京:机械工业出版社,2010:114-122.

[21]
韩李涛,孔巧丽,戴洪磊,等.基于OpenGL的规则格网地形法线计算优化研究[J].测绘科学,2012,37(5): 17-19.

Options
文章导航

/

〈 〉