互聯網地圖美學設計與場景構建研究
——以《武漢紅色文化地圖》移動系統開發為例

程思聰，譚仁春，黃思思

(武漢市測繪研究院，湖北 武漢 430022)

1 引 言

地圖是人們記錄、認識、分析客觀地理環境的手段和工具，在人類社會的發展中發揮著重要作用[1]。隨著移動端可視化技術手段的提高，在線地圖成為信息時代的地圖服務形式，根據用戶需求提供自動搜索、人工查詢、在線交流等方面的地圖服務[2]。隨著公眾地圖審美的提高，研究地圖美學設計、藝術化表達以及主題化場景構建，從而更好地實現信息傳輸與主題表達是十分必要的。為了慶祝中國共產黨成立100周年，武漢市測繪研究院開發了《武漢紅色文化地圖》移動系統。系統以移動互聯網為載體平臺，從地圖美學設計理念角度出發，構建了可漫游交互的武漢市紅色文化場景。本文以《武漢紅色文化地圖》移動系統開發為例，對互聯網地圖美學設計與場景構建的理論與技術實踐展開探討。

2 地圖美學理論基礎

2.1 地圖美學思維

地圖的美學內涵具有鮮明的跨域特點。首先，地圖擁有比例尺、坐標系、地圖投影等數學基礎，保證了地圖的科學性。其次，地圖擁有抽象化符號語言并以信息傳遞為目的，保證了地圖的藝術性和實用性，因此，地圖是科學、實用和藝術的完美融合，是形象思維和邏輯思維的和諧統一。此外，互聯網地圖相比于傳統地圖還具有交互性、動態性、共享性、多維度等特點，在構建立體化場景方面更具技術優勢，并能營造豐富的意境美，從而更加廣泛深入地傳遞主題理念與文化價值。

2.2 地圖美學元素

從地圖美學思維出發，構成其美學元素包括三種：藝術美、科學美與實意境美。地圖藝術美元素主要指符號、色彩和注記[3]，這也是地圖語言的基本要素。地圖符號通過形狀、尺寸、色彩、方向、亮度和密度等基本變量反映事物的數量和質量特性，色彩則是運用色相、亮度和飽和度的變化與組合，結合人對色彩感受的心理特征，建立色彩與制圖對象的聯系。地圖注記是指字體、字大(字號)、字色、字隔、字位、字向和字順等注記要素，注記通常與點、線、面、體組合共同構成地物的幾何特征與屬性特征。通過符號、色彩和注記的設計，使得地圖呈現出風格化的形象效果，帶給人藝術化的直觀感受。

科學美是指地圖所反映地理空間事物的準確性與自然和諧，而使人產生的美學感受[4]，主要通過地圖內容的準確性、綜合性、整體性與邏輯性來體現。首先關于準確性，從地圖的定義來看，數學基礎是其準確性的保障依據。地圖的綜合性指地圖要素的取舍與概括，主要為了信息密度與負載量的平衡。地圖本質上就是對現實客觀世界的抽象表達，這個過程中必然要對信息進行取舍與概括。整體性和邏輯性是從地圖要素的層次劃分、要素關系的協調處理、內容的排版布局等方面體現，針對電子地圖還包括多比例尺縮放顯示、交互操作之間的有序銜接等。

意境美是將形式與內容融合，通過風格化的藝術表達、理性化的時空呈現以及整體貫徹的主題價值傳遞，營造具有沉浸感的地圖場景。地圖的意境美起初源自山水畫作筆法，早期地圖作品與山水畫作有著緊密聯系，包括自然地理要素之間的空間關系和作者的主題抒發。因此地圖設計可借助其中的技巧，比如散點透視、移步換景的方法[5]，對于意境美的營造頗具效果。

3 移動系統美學設計與數據處理

3.1 設計構想

作為宣傳建黨100周年的主題性作品，《武漢紅色文化地圖》移動系統具有明確的主題導向和價值傳遞目標，從表現形式到內容選取都緊緊圍繞紅色文化主題，旨在展示武漢市豐富的紅色文化資源和輝煌的百年發展歷程，同時也是對互聯網地圖美學場景理念的一次探索實踐。

系統通過紅色印跡、城市發展元素的符號設計，橙紅相融、穩重濃烈的色彩設計，突出紅色、文化、發展的風格主題，體現電子地圖的藝術美。通過以中心城區為范圍的紅色印跡空間分布漫游與信息查詢、以時間為軸線的重大事件呈現，使內容組織準確性、邏輯性與整體性相結合，從空間寫意與時間敘事的角度體現電子地圖的科學美。通過分類分級界面模塊的設計與交互營造出沉浸式的動態交互場景，體現地圖的意境美。此外，閱讀地圖是視覺表達與用戶思維的交互過程，認知心理學在其中起到重要作用，設計者必須考慮到互聯網移動用戶的使用習慣、地圖的使用和交互環境等[6]，設計多比例尺縮放與專題要素的分層分級顯示、三維模型交互、數據組織關聯等，對武漢紅色人物、事件與場景進行開發挖掘與發布展示，使用戶在紙質版基礎上，從空間、時間與事件的角度獲取更深入廣泛的信息，達到宣傳建黨100周年以及武漢紅色文化的作用。紅色地圖系統美學設計框架如圖1所示。

圖1 紅色地圖系統美學設計框架

3.2 數據處理

移動系統數據包括地理底圖與專題信息兩類數據處理與加載，是地圖美學呈現的數據基底。其中地理底圖作為背景輔助，專題信息作為主題表達的重點。

地理底圖范圍是武漢全市域，主要數據來源是OSM開源地圖數據，結合權威的基礎地理信息數據庫進行更新與清理，使其滿足準確性、美觀性的需要。包括全市高速、國道、省道、主干道、次干道等主要路網、水系、山體綠地等自然地理要素以及市界、區級以上政府駐地、重要交通及市政設施、公園廣場、大專院校、標志性建筑等社會人文要素。地理底圖數據如圖2所示。

圖2 地理底圖數據

專題信息包括黨史遺址暨愛國主義教育基地、黨史遺址、黨史遺跡、愛國主義教育基地四大類紅色專題點位及相關文字、圖片、圖表、插圖等信息。專題信息的處理主要包括坐標定位與屬性建庫，并在此基礎實現數據導入編輯。結合基礎地理信息數據庫以及互聯網地圖對專題點位進行經緯度坐標標定和地址記錄。結合前端地圖展示需求，將Excel數據表格按照一定屬性字段(如表1所示)轉換為JSON文件，并采用ArcGIS軟件將Excel數據通過XY坐標生成工具實現點狀shp數據的轉換，進而結合路網確定統一坐標系，導入Mapbox編輯器中。

表1

3.3 視覺層次設計

視覺層次設計針對整體布局和地圖主體兩類。其中整體布局是指移動端界面的功能分布，包括主圖及信息卡片、菜單導航欄、搜索欄等，主圖及信息卡片為第一視覺層次，菜單導航欄為第二視覺層次，搜索欄為第三視覺層次。視覺層次設置如圖3所示。

圖3 視覺層次設置

地圖主體視覺層次分為靜態和動態兩種模式，其中靜態視覺層次體現的是同一比例尺下不同要素之間的視覺層次差異，第一層次是紅色文化專題信息，通過細節真實的三維模型以及醒目形象的圖標符號結合注記表示，第二層次是標志性地物，采用弱化的符號與建筑模型體現，第三層次是地理底圖要素，包括路網、水系、綠地等，采用簡潔的符號表示。

動態視覺層次體現的是不同比例尺下不同要素的顯示級別，針對屏幕負載量限制，不同重要性的要素設置不同的顯示級別，比如黨史遺址暨愛國主義教育基地專題是第一顯示層級，黨史遺址和黨史遺跡是第二顯示層級、愛國主義教育基地是第三顯示層級。動態視覺層次的設計使得用戶在縮放比例尺漫游地圖時，重要專題信息始終在第一視覺層面，保證任何尺度下圖面的層次清晰。

3.4 符號設計

紅色地圖的符號設計考慮了心理學認知相關知識。地圖上的圖形符號與色彩都應看作是客觀環境刺激的表現形式，而讀圖者對地圖的視覺反應則是感受和經驗的綜合疊加。在地圖符號設計中引入心物學方法，就是企圖探討刺激與反應的內在關聯，融入符號的美學設計，使圖形符號及色彩適應視覺感受的特點，從而提高地圖的信息傳遞效果[7]。而人對事物感受的深化和加強正是在舊的審美經驗記憶基礎上推陳出新而獲得的[8]，因此在符號設計時，需要參考以往的地圖符號與常規標準，充分考慮到紅色主題因素，體現象征性。

4 紅色文化場景模塊的構建開發

4.1 整體場景構建

整體場景按照入口、主場、專場的模式布置，由淺入深、由粗到細、由整體到局部，層層深入構建紅色文化場景。通過封面將用戶帶入紅色文化主題氛圍，主場是以兩江三岸交匯及其周邊為范圍的地域空間分布，使用戶進入紅色專題地理空間，專場設置不同的專題模塊“紅色印跡”“紅色線路”和“百年輝煌”，通過時間軸線、線路走向、敘事描述等從不同角度、不同層面、不同維度向用戶呈現豐富的專題與空間信息。場景入口與主場景如圖4所示。

圖4 場景入口與主場景

4.2 紅色印跡模塊

“紅色印跡”模塊從三維場景角度展示了武漢黨史遺址、黨史遺跡、愛國主義教育基地、紅色旅游資源及紅色教育資源等紅色信息，并提供了信息檢索、三維交互等功能。其中裝飾欄以專題紅色為底色，建黨百年圖標放置左側，在百年建黨史武漢的變遷中選擇從古至今的三個典型建筑作為主題內容，并用小片綠色樹葉作為點綴。主體部分展現紅色專題信息，包含紅色專題縮略圖、名稱和地址。點擊縮略圖進入三級頁面，展示各專題點位詳細信息，并顯示切換3D視圖。

4.3 紅色線路模塊

“紅色線路”模塊包括紅色經典、偉人足跡、紅色寶藏、建軍策源、革命烽火、紅色英烈等6條紅色旅游的線路、景點等詳細信息。線路地圖展示紅色線路整體走向，并將其定位于圖面中心。線路詳情包括線路途經點，每個景點之間步行與車行的距離和時長，同時可點擊進入景點詳情介紹。線路樣式以結合紅色專題色為底色的縱向樣式條展開，每個路線景點所在行用較大紅色圓點樣式，里程展示所在行用白色小圓點樣式，并用高級紅色樣式條連接。步行里程和駕車里程兩端對齊，結合Icon圖標便于用戶快速理解。

4.4 百年輝煌模塊

“百年輝煌”模塊采用時間敘事和信息圖表融合表達的方式(圖5)，展示了新民主主義革命時期(開天辟地)、社會主義革命和建設時期(改天換地)、改革開放和社會主義現代化建設新時期(翻天覆地)和中國特色社會主義新時代(驚天動地)四個發展階段武漢社會經濟、科技文化等方面的發展成就。主要采用時間軸形式呈現各個時期的歷史進程與重大事件節點，并采用從整體到局部、通過不同角度不同專題呈現輝煌發展歷程。

圖5 紅色文化場景模塊

5 結 論

地圖美學是近年來地圖學領域興起的研究方向，將地圖的科學性與藝術性充分融合，并采用多樣化的藝術與技術手段充分挖掘地圖的美學價值，提升地圖的人文功能。其中對于互聯網地圖美學的研究是重要關注點，以傳統地圖美學思維為基礎，充分利用三維實景、虛擬現實、人工智能、場景模擬、動態交互等多種現代技術，并結合認知心理學、信息傳輸學、美學、地圖學等理論科學，使古老的地圖在現代互聯網時代重新煥發生機，充分發揮其科學實用與藝術美學兼顧的功效。