王喬俊,何原榮,李佳楠

(1.桂林旅游學(xué)院 旅游與休閑管理系，廣西 桂林 541006;2.廈門理工學(xué)院 計(jì)算機(jī)與信息工程學(xué)院，福建 廈門 361024;3.貴州財(cái)經(jīng)大學(xué) 管理科學(xué)與工程管理學(xué)院，貴州 貴陽(yáng) 550004)

基于SVG的旅游地圖符號(hào)庫(kù)的設(shè)計(jì)與實(shí)現(xiàn)

王喬俊1,何原榮2,李佳楠3

(1.桂林旅游學(xué)院 旅游與休閑管理系，廣西 桂林 541006;2.廈門理工學(xué)院 計(jì)算機(jī)與信息工程學(xué)院，福建 廈門 361024;3.貴州財(cái)經(jīng)大學(xué) 管理科學(xué)與工程管理學(xué)院，貴州 貴陽(yáng) 550004)

旅游地圖符號(hào)是傳播旅游信息,提供旅游服務(wù)的專題性地圖符號(hào)，是旅游地理信息系統(tǒng)(TGIS)中重要的組成部分。但傳統(tǒng)方法制作的符號(hào)標(biāo)準(zhǔn)不統(tǒng)一，可移植性較差。而SVG是矢量圖像格式，文件體積小，動(dòng)態(tài)交互性強(qiáng)，便于傳輸和共享。因此，本文借助于SVG設(shè)計(jì)并實(shí)現(xiàn)旅游地圖符號(hào),提高符號(hào)的可移植性,實(shí)現(xiàn)符號(hào)的規(guī)范化、標(biāo)準(zhǔn)化和實(shí)用性，為旅游信息的可視化表達(dá)提供基礎(chǔ)的圖形數(shù)據(jù)。

SVG;旅游地圖符號(hào);設(shè)計(jì)；實(shí)現(xiàn)

旅游地圖符號(hào)是傳播旅游信息,提供旅游服務(wù)的專題性地圖符號(hào)[1],是旅游地理信息系統(tǒng)(TGIS)中重要的組成部分。但傳統(tǒng)的旅游地圖符號(hào)的制作一般通過Photoshop,Coreldraw,MapInfo等軟件繪制,缺少兼容性,可移植性較差。而旅游地圖符號(hào)設(shè)計(jì)的質(zhì)量將直接影響旅游地圖信息的傳遞效果,以及旅游地理信息可視化的表達(dá)和傳遞。因此,本文借助于SVG設(shè)計(jì)并實(shí)現(xiàn)旅游地圖符號(hào),提高符號(hào)的可移植性,規(guī)范化旅游地圖符號(hào)，實(shí)現(xiàn)程序間的共享,為建立旅游地理信息系統(tǒng)提供基礎(chǔ)的圖形數(shù)據(jù)。

一、SVG繪制旅游地圖符號(hào)的格式及其設(shè)計(jì)原則

(一)SVG繪制旅游地圖符號(hào)的格式

SVG 指可伸縮矢量圖形 (Scalable Vector Graphics)，是基于可擴(kuò)展標(biāo)記語(yǔ)言(XML)，用于描述二維矢量圖形的一種圖形格式[2,3]

Line是標(biāo)注你選擇的圖形要素，對(duì)于線要素而言，主要是找到線段的兩個(gè)端點(diǎn)值，而(X1，Y1)是起點(diǎn)的坐標(biāo)值，而(X2，Y2)是終點(diǎn)的坐標(biāo)，stroke是對(duì)線段的輪廓著色(none代表無(wú)色) stroke-opacity是透明度(0表示不透明)。對(duì)于標(biāo)簽而言，每個(gè)標(biāo)簽都必須有始有終，也就是有開始的<>和結(jié)束的樣式。

(二)設(shè)計(jì)原則

1.可移植性

在進(jìn)行旅游地圖符號(hào)設(shè)計(jì)時(shí),要考慮到設(shè)計(jì)的符號(hào)便于不同開發(fā)平臺(tái)的訪問和調(diào)用,減少符號(hào)的重復(fù)設(shè)計(jì)與開發(fā)工作,提高符號(hào)庫(kù)的使用效率。

2.象征性

在設(shè)計(jì)符號(hào)時(shí)要考慮到使整個(gè)旅游地圖符號(hào)便于識(shí)別和記憶。因此，可以采用一些象征意義的圖來(lái)表達(dá)，如餐飲點(diǎn)符號(hào)可以用刀叉組合符號(hào)來(lái)表達(dá)，酒吧用一個(gè)酒杯來(lái)表達(dá)，購(gòu)物點(diǎn)可以用一個(gè)購(gòu)物車來(lái)表達(dá)。

3.美觀藝術(shù)性

旅游地圖符號(hào)最終是為游客服務(wù)的,而旅游本身也是一種審美的提升。因此,在設(shè)計(jì)旅游地圖符號(hào)時(shí)要兼顧游客的審美心理,做到既美觀大方,又生動(dòng)形象；既造型優(yōu)美,又色彩鮮明。

4.實(shí)用性

旅游地圖符號(hào)的設(shè)計(jì)要以實(shí)用為原則,不能過于標(biāo)新立異,設(shè)計(jì)過于復(fù)雜、深?yuàn)W,讓人難以理解,不利于記憶，制作和使用也不方便。

二、SVG符號(hào)的繪制方法

(一)直接繪制

繪制SVG圖形的常用軟件包括Illustrator、Inkscape和Sketsa等。對(duì)于一些由簡(jiǎn)單要素對(duì)象直接構(gòu)成的地圖符號(hào)而言，用軟件繪制操作簡(jiǎn)便，不需要制作者具備SVG編程經(jīng)驗(yàn)，降低了操作難度。如鋁礦和鎢礦等礦產(chǎn)資源類型符號(hào)由矩形、圓形和三角形等形狀簡(jiǎn)單圖元構(gòu)造。因此，可用軟件直接繪制，繪制效果如圖1所示。

圖1 采用軟件繪制的SVG符號(hào)

但是通過軟件繪制并輸出的SVG文件格式并不是完全標(biāo)準(zhǔn)文件格式，缺少兼容性，需要修改文件頭的結(jié)構(gòu)代碼。以銅礦SVG代碼的修改為例：在Sketsa軟件中直接繪制生成的代碼如圖2(a)所示，該文件的格式和標(biāo)準(zhǔn)的SVG文件格式不同，文件頭的描述有些復(fù)雜，因?yàn)榍度肓薙ketsa軟件自定義的調(diào)用格式。圖2(b)的SVG代碼是修改后的標(biāo)準(zhǔn)SVG文件代碼。一般都是由三個(gè)部分組成：文件版本和文件類型定義、文件中將要使用的圖元定義以及使用圖元畫圖。

(a)采用Sketsa軟件繪制并輸出的SVG文件

(b)按標(biāo)準(zhǔn)格式修改的SVG文件

圖2 Sketsa軟件輸出的銅礦點(diǎn)符號(hào)SVG文件

(二)編程法

這種方法適合那些能用數(shù)學(xué)表達(dá)方式描述的地圖符號(hào)，也適用于能夠由基本圖形元素聚集的符號(hào)。像珍珠巖和金剛石等，這類符號(hào)一般都含有弧形或者曲線等圖元，用軟件繪制準(zhǔn)確表達(dá)困難或者復(fù)雜，采用編程法很容易實(shí)現(xiàn)，而且代碼簡(jiǎn)單，珍珠巖的編碼如下面所示，示意圖如圖1中的c所示。

//通過路徑繪制一個(gè)封閉的半圓弧，并填充顏色

(三)混合法

即編程與軟件相結(jié)合的方法。利用這種方法繪制的圖形一般都有一個(gè)共性，即圖形可以拆分為兩個(gè)部分：一部分是軟件提供的基本圖形組成；另一部分則必須要用編程才能實(shí)現(xiàn)的復(fù)雜圖元。如滑坡點(diǎn)、塌陷點(diǎn)、泥石流、崩塌點(diǎn)、噪聲監(jiān)測(cè)點(diǎn)、水塔等。

圖3 采用混合方式編制的礦區(qū)環(huán)境監(jiān)測(cè)符號(hào)

這種方式的優(yōu)點(diǎn)在于可以降低開發(fā)難度，節(jié)省時(shí)間，不足之處在于有時(shí)代碼稍微復(fù)雜。例如，水塔符號(hào)是由一個(gè)封閉圓弧和一個(gè)梯形組成。梯形可以用軟件提供的多邊形工具繪制，而封閉圓弧必須采用編程來(lái)實(shí)現(xiàn)，實(shí)現(xiàn)代碼如下：

//利用Sketsa軟件繪制梯形

//利用記事本編程繪制一個(gè)封閉的圓弧

三、基于SVG的旅游地圖符號(hào)的實(shí)現(xiàn)

(一)旅游地圖符號(hào)的實(shí)現(xiàn)流程

旅游地圖符號(hào)種類繁多、復(fù)雜，缺乏統(tǒng)一的標(biāo)準(zhǔn)格式。因此，設(shè)計(jì)與開發(fā)符號(hào)之前要對(duì)旅游地圖符號(hào)進(jìn)行統(tǒng)計(jì)、分類整理，再按照符號(hào)的設(shè)計(jì)原則進(jìn)行設(shè)計(jì)，最后用SVG開放式的語(yǔ)言來(lái)描述旅游地圖符號(hào)，實(shí)現(xiàn)的流程如圖4所示。

圖4 旅游地圖符號(hào)的實(shí)現(xiàn)流程

(二)旅游地圖符號(hào)的實(shí)現(xiàn)

本文以購(gòu)物符號(hào)、酒店賓館符號(hào)、餐飲符號(hào)的設(shè)計(jì)為例闡述其實(shí)現(xiàn)理念和方法。購(gòu)物符號(hào)的設(shè)計(jì)以線條和圓形組合成購(gòu)物車形狀的象征意義的形象標(biāo)識(shí)，并以綠色渲染，體現(xiàn)和宣傳綠色、環(huán)保的購(gòu)物理念，既符合旅游地圖符號(hào)的設(shè)計(jì)要求，又能體現(xiàn)出其深遠(yuǎn)的教育意義功能；酒店賓館符號(hào)的設(shè)計(jì)以基本的幾何形狀組合而成，形象生動(dòng)地表達(dá)了酒店賓館的內(nèi)涵，又體現(xiàn)了人性化的設(shè)計(jì)理念，便于游客理解和記憶；餐飲符號(hào)的設(shè)計(jì)沿用了普通公認(rèn)的一種設(shè)計(jì)標(biāo)識(shí)，用刀叉組合表達(dá)了整個(gè)餐飲的內(nèi)涵，既清晰明了，又具有通識(shí)性，而且用紅色來(lái)渲染此符號(hào)，象征一種活力、熱情和生命力，帶著一種正能量傳遞給游客，帶來(lái)更好的旅游體驗(yàn)。本文用SVG實(shí)現(xiàn)一組旅游地圖符號(hào)的顯示效果如圖5所示。其中，實(shí)現(xiàn)酒店賓館的核心代碼如下：

圖5 旅游地圖符號(hào)的SVG設(shè)計(jì)效果

//酒店賓館符號(hào)

四、總結(jié)

本文研究了一套旅游地圖SVG符號(hào)編制方法，應(yīng)用實(shí)踐表明編制的SVG旅游地圖符號(hào)為旅游信息的可視化表達(dá)與網(wǎng)絡(luò)傳播提供了較好的技術(shù)解決方案。而且，SVG圖像具有動(dòng)態(tài)交互性，能夠融合高亮、聲效、特效、動(dòng)畫等效果，展現(xiàn)出豐富多彩的地圖符號(hào)，且SVG文件中的文字可以被網(wǎng)絡(luò)搜索引擎作為關(guān)鍵詞搜索到，這些為實(shí)現(xiàn)TGIS提供強(qiáng)有力的技術(shù)支撐。

[1]蔣春燕,馮學(xué)鋼,凌善金.基于視覺形態(tài)的旅游地圖符號(hào)分類探究[J].桂林旅游高等?？茖W(xué)校學(xué)報(bào),2008,19(3):355～359.

[2]謝智穎,李清泉,左小清，等.基于SVG的開放式LBS系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].武漢大學(xué)學(xué)報(bào)(信息科學(xué)版),2003,28(1):74～78.

[3]錢瑞偉,孔婷等.基于SVG的實(shí)時(shí)WebGIS技術(shù)研究[J].計(jì)算機(jī)科學(xué),2007,34(11):86～88.105.

[4]張旭,尹振江.基于SVG的空間數(shù)據(jù)組織及Web表現(xiàn)的研究[J].計(jì)算機(jī)應(yīng)用研究,2003,20(5):130～134.

[5]王興玲.SVG與矢量地圖的Web發(fā)布技術(shù)[J].計(jì)算機(jī)工程與應(yīng)用,2012，(10):1～4.

2095-4654(2015)08-0021-03

2015-04-18

廣西旅游產(chǎn)業(yè)人才小高地人才提升專項(xiàng)研究項(xiàng)目(GXRCGD201407)資助;廣西教育科研項(xiàng)目(201103YB151)

F590

A