APP下载

基于SVG的旅游地图符号库的设计与实现

2015-06-23王乔俊何原荣李佳楠

湖北科技学院学报 2015年8期
关键词:代码绘制编程

王乔俊,何原荣,李佳楠

(1.桂林旅游学院 旅游与休闲管理系,广西 桂林 541006;2.厦门理工学院 计算机与信息工程学院,福建 厦门 361024;3.贵州财经大学 管理科学与工程管理学院,贵州 贵阳 550004)

基于SVG的旅游地图符号库的设计与实现

王乔俊1,何原荣2,李佳楠3

(1.桂林旅游学院 旅游与休闲管理系,广西 桂林 541006;2.厦门理工学院 计算机与信息工程学院,福建 厦门 361024;3.贵州财经大学 管理科学与工程管理学院,贵州 贵阳 550004)

旅游地图符号是传播旅游信息,提供旅游服务的专题性地图符号,是旅游地理信息系统(TGIS)中重要的组成部分。但传统方法制作的符号标准不统一,可移植性较差。而SVG是矢量图像格式,文件体积小,动态交互性强,便于传输和共享。因此,本文借助于SVG设计并实现旅游地图符号,提高符号的可移植性,实现符号的规范化、标准化和实用性,为旅游信息的可视化表达提供基础的图形数据。

SVG;旅游地图符号;设计;实现

旅游地图符号是传播旅游信息,提供旅游服务的专题性地图符号[1],是旅游地理信息系统(TGIS)中重要的组成部分。但传统的旅游地图符号的制作一般通过Photoshop,Coreldraw,MapInfo等软件绘制,缺少兼容性,可移植性较差。而旅游地图符号设计的质量将直接影响旅游地图信息的传递效果,以及旅游地理信息可视化的表达和传递。因此,本文借助于SVG设计并实现旅游地图符号,提高符号的可移植性,规范化旅游地图符号,实现程序间的共享,为建立旅游地理信息系统提供基础的图形数据。

一、SVG绘制旅游地图符号的格式及其设计原则

(一)SVG绘制旅游地图符号的格式

SVG 指可伸缩矢量图形 (Scalable Vector Graphics),是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式[2,3]

Line是标注你选择的图形要素,对于线要素而言,主要是找到线段的两个端点值,而(X1,Y1)是起点的坐标值,而(X2,Y2)是终点的坐标,stroke是对线段的轮廓着色(none代表无色) stroke-opacity是透明度(0表示不透明)。对于标签而言,每个标签都必须有始有终,也就是有开始的<>和结束的样式。

(二)设计原则

1.可移植性

在进行旅游地图符号设计时,要考虑到设计的符号便于不同开发平台的访问和调用,减少符号的重复设计与开发工作,提高符号库的使用效率。

2.象征性

在设计符号时要考虑到使整个旅游地图符号便于识别和记忆。因此,可以采用一些象征意义的图来表达,如餐饮点符号可以用刀叉组合符号来表达,酒吧用一个酒杯来表达,购物点可以用一个购物车来表达。

3.美观艺术性

旅游地图符号最终是为游客服务的,而旅游本身也是一种审美的提升。因此,在设计旅游地图符号时要兼顾游客的审美心理,做到既美观大方,又生动形象;既造型优美,又色彩鲜明。

4.实用性

旅游地图符号的设计要以实用为原则,不能过于标新立异,设计过于复杂、深奥,让人难以理解,不利于记忆,制作和使用也不方便。

二、SVG符号的绘制方法

(一)直接绘制

绘制SVG图形的常用软件包括Illustrator、Inkscape和Sketsa等。对于一些由简单要素对象直接构成的地图符号而言,用软件绘制操作简便,不需要制作者具备SVG编程经验,降低了操作难度。如铝矿和钨矿等矿产资源类型符号由矩形、圆形和三角形等形状简单图元构造。因此,可用软件直接绘制,绘制效果如图1所示。

图1 采用软件绘制的SVG符号

但是通过软件绘制并输出的SVG文件格式并不是完全标准文件格式,缺少兼容性,需要修改文件头的结构代码。以铜矿SVG代码的修改为例:在Sketsa软件中直接绘制生成的代码如图2(a)所示,该文件的格式和标准的SVG文件格式不同,文件头的描述有些复杂,因为嵌入了Sketsa软件自定义的调用格式。图2(b)的SVG代码是修改后的标准SVG文件代码。一般都是由三个部分组成:文件版本和文件类型定义、文件中将要使用的图元定义以及使用图元画图。

(a)采用Sketsa软件绘制并输出的SVG文件

(b)按标准格式修改的SVG文件

图2 Sketsa软件输出的铜矿点符号SVG文件

(二)编程法

这种方法适合那些能用数学表达方式描述的地图符号,也适用于能够由基本图形元素聚集的符号。像珍珠岩和金刚石等,这类符号一般都含有弧形或者曲线等图元,用软件绘制准确表达困难或者复杂,采用编程法很容易实现,而且代码简单,珍珠岩的编码如下面所示,示意图如图1中的c所示。

//通过路径绘制一个封闭的半圆弧,并填充颜色

(三)混合法

即编程与软件相结合的方法。利用这种方法绘制的图形一般都有一个共性,即图形可以拆分为两个部分:一部分是软件提供的基本图形组成;另一部分则必须要用编程才能实现的复杂图元。如滑坡点、塌陷点、泥石流、崩塌点、噪声监测点、水塔等。

图3 采用混合方式编制的矿区环境监测符号

这种方式的优点在于可以降低开发难度,节省时间,不足之处在于有时代码稍微复杂。例如,水塔符号是由一个封闭圆弧和一个梯形组成。梯形可以用软件提供的多边形工具绘制,而封闭圆弧必须采用编程来实现,实现代码如下:

//利用Sketsa软件绘制梯形

//利用记事本编程绘制一个封闭的圆弧

三、基于SVG的旅游地图符号的实现

(一)旅游地图符号的实现流程

旅游地图符号种类繁多、复杂,缺乏统一的标准格式。因此,设计与开发符号之前要对旅游地图符号进行统计、分类整理,再按照符号的设计原则进行设计,最后用SVG开放式的语言来描述旅游地图符号,实现的流程如图4所示。

图4 旅游地图符号的实现流程

(二)旅游地图符号的实现

本文以购物符号、酒店宾馆符号、餐饮符号的设计为例阐述其实现理念和方法。购物符号的设计以线条和圆形组合成购物车形状的象征意义的形象标识,并以绿色渲染,体现和宣传绿色、环保的购物理念,既符合旅游地图符号的设计要求,又能体现出其深远的教育意义功能;酒店宾馆符号的设计以基本的几何形状组合而成,形象生动地表达了酒店宾馆的内涵,又体现了人性化的设计理念,便于游客理解和记忆;餐饮符号的设计沿用了普通公认的一种设计标识,用刀叉组合表达了整个餐饮的内涵,既清晰明了,又具有通识性,而且用红色来渲染此符号,象征一种活力、热情和生命力,带着一种正能量传递给游客,带来更好的旅游体验。本文用SVG实现一组旅游地图符号的显示效果如图5所示。其中,实现酒店宾馆的核心代码如下:

图5 旅游地图符号的SVG设计效果

//酒店宾馆符号

四、总结

本文研究了一套旅游地图SVG符号编制方法,应用实践表明编制的SVG旅游地图符号为旅游信息的可视化表达与网络传播提供了较好的技术解决方案。而且,SVG图像具有动态交互性,能够融合高亮、声效、特效、动画等效果,展现出丰富多彩的地图符号,且SVG文件中的文字可以被网络搜索引擎作为关键词搜索到,这些为实现TGIS提供强有力的技术支撑。

[1]蒋春燕,冯学钢,凌善金.基于视觉形态的旅游地图符号分类探究[J].桂林旅游高等专科学校学报,2008,19(3):355~359.

[2]谢智颖,李清泉,左小清,等.基于SVG的开放式LBS系统设计与实现[J].武汉大学学报(信息科学版),2003,28(1):74~78.

[3]钱瑞伟,孔婷等.基于SVG的实时WebGIS技术研究[J].计算机科学,2007,34(11):86~88.105.

[4]张旭,尹振江.基于SVG的空间数据组织及Web表现的研究[J].计算机应用研究,2003,20(5):130~134.

[5]王兴玲.SVG与矢量地图的Web发布技术[J].计算机工程与应用,2012,(10):1~4.

2095-4654(2015)08-0021-03

2015-04-18

广西旅游产业人才小高地人才提升专项研究项目(GXRCGD201407)资助;广西教育科研项目(201103YB151)

F590

A

猜你喜欢

代码绘制编程
编程,是一种态度
元征X-431实测:奔驰发动机编程
编程小能手
纺织机上诞生的编程
超萌小鹿课程表
创世代码
创世代码
创世代码
创世代码
放学后