组件式三维WebGIS系统设计与实现

测绘与空间地理信息

GEOMATICS

&

SPATIAL

INFORMATION

TECHNOLOGY

第

44

卷第

5

期

2021

年

5

月

Vol.44

，

No.5

May

，

2021

组件式三维

WebGIS

系统设计与实现

邱天

，

董敬儒

，

颉耀文

（

兰州大学资源环境学院

，

甘肃兰州

730000

）

摘要

：

针对传统三维

WebGIS

系统通常需要安装浏览器插件且存在前期开发效率低

、

系统后期可维护性差的问

题

，

本文提出利用

Cesium

三维地球框架结合

Vue

前端框架开发三维

WebGIS

的思路

。

系统通过

Vue

组织代码进

行组件式开发

，

以天地图在线影像服务和本地发布的地形服务为数据源

，

利用

Cesium

构建三维场景

，

将

“

祁连

山

一

阿尔金山

”

专题地图集在此三维场景上叠加显示

，

同时提供测量

、

等高线填充和坡度坡向分析等功能

。

结果

表明

，

系统具有开发周期短

、

后期可维护性高

、

操作方便

、

界面流畅的特点

，

并且能立体

、

直观

、

全方位角度展示专

题地图

。

研究结果不仅能满足第二次青藏科考的需要

，

还能服务于祁连山国家公园建设和其他研究工作

。

关键词

：

三维

WebGIS

；

Vue.js

；

Cesium.js

;

组件式

；

专题地图

中图分类号

：

P208

文献标识码

：

A

文章编号

：

1672-5867

（

2021

）

05-0021-04

Design

and

Implementation

of

Component-based

3D

WebGIS

System

QIU

Tian

,

DONG

Jingru,

XIE

Yaowen

(

The

Institute

of

Remote

Sensing

and

GIS

,

Lanzhou

University

,

Lanzhou

730000

,

China

)

Abstract

:

In

view

of

the

problems

in

the

traditional

3D

WebGIS

system

,

for

example

,

it

needs

to

install

browser

plug-in

and

has

low

development

efficiency

in

the

early

stage

and

poor

maintainability

in

the

later

stage

,

the

idea

of

developing

3D

WebGIS

with

cesium

3D

Earth

framework

and

Vue

front-end

framework

is

proposed

in

this

paper.

Taking

“

TIANDITU

”

online

image

service

and

local

terrain

service

as

the

data

source,

the

system

conducts

component

development

through

Vue

and

constructs

3d

scene

with

Cesium.

The

the

­

matic

atlas

of

“

Qilian-altun

mountain

”

is

superimposed

on

this

3d

scene

,

and

it

also

provides

functions

such

as

measurement

,

contour

generation,

and

slope

and

aspect

analysis.

The

result

shows

that

the

system

has

the

characteristics

of

short

development

cycle,

high

maintainability

,

easy

operation,

and

smooth

interface,

and

can

display

the

thematic

map

from

a

three-dimensional,

intuitive,

and

all

­

round

perspective.

The

results

can

not

only

meet

the

requirements

of

the

second

Qinghai-tibet

scientific

expedition,

but

also

serve

the 

construction

of

Qilian

mountain

national

park

and

other

research

work.

Key

words

:

3D

WebGIS

;

Vue.js

；

Cesium.js

；

components

；

thematic

map

0

引

言

目前

，

第二次青藏高原综合科学考察研究关键

区

一

祁连山一阿尔金山地区综合考察研究工作已经开

始

。

作为西北地区重要生态屏障的祁连山

［

1

］

,

在过去

50

年间环境发生了剧烈变化

［

2

］

。

但即将要开展的科考缺乏

对区域现势地理基础概况的了解和相关软件系统支持

，

给考察工作带来不便

，

因此有必要对该地区进行地理基

础情况现势调查

，

并开发三维

WebGIS

系统对考察结果进

行展示

。

与二维

WebGIS

相比

,

三维

WebGIS

接近人眼视

觉习惯

，

地物显示更真实

，

可更好地呈现出空间关系

因此

,

在三维

WebGIS

中进行专题地图可视化

，

使其以更

加清晰直观的方式展示

，

发掘隐藏在专题地图的隐含信

息

，

能发挥专题地图中数据的最大作用

。

传统的三维

WebGIS

技术通常需要安装客户端或插

件

,

且具有显示效果不佳

、

兼容性差等缺陷

［

4

］

。

WebGL

技

术的出现提出了一种在浏览器中绘制三维图形的新方

法

，

它能直接与

GPU

（

Graphics

Processing

Unit,

图形处理

器

）

通信绘制三维场景

，

提供硬件

3D

加速渲染

［

5

］

o

因此

,

基于

WebGL

技术涌现了一大批三维地球框架

，

如

Cesium.

收稿日期

：

2020-05-12

基金项目

：

兰州大学祁连山研究院开放课题项目

（

504000

-

87080306

）

资助

作者简介

:

邱天

（

1994

-

）

，

男

，

湖北十堰人

，

地图学与地理信息系统专业硕士研究生

，

主要研究方向为三维

GIS

开发与应用

。

通讯作者

:

颉耀文

（

1969

-

）

，

男

，

甘肃天水人

，

教授

，

博士

,2003

年毕业于兰州大学自然地理学专业

，

主要从事基于地理信息技术的干

旱区环境变化研究与教学工作