学GIS开发，都应该了解的顺序！

01 学习人群

一般来说，学习WebGIS开发的人员有两类。

• 其中较为庞大的群体是3S（GIS、RS、GNSS）及相关专业的学生；

• 另一类是计算机专业的学生

2024年陆续也有一些其他专业的人士也对进入WebGIS开发行业感兴趣，这里不多赘述。

这里重点讲述0基础的学生学习WebGIS的方法和路线。

通常，3S专业的学生在大学期间学习了多门相关课程，如：

• C语言程序设计与开发

• 地理信息系统概论

• GIS 设计与开发

• 面向对象设计与开发

• 网页设计与制作

• 人工智能与专家系统

• 遥感地学分析

• 空间数据库和关系数据库等

在此基础上，我们需要了解一些WebGIS开发的编程语言。

02 编程语言和基础

大家在学校所接触的编程语言也有多种，从C语言到C++、C#、Java等，相信大家都有所接触，其他专业的没接触过的也至少所有耳闻。

但是，这里要跟大家重点说明，毕竟编程语言的选择，非常重要！

虽然C语言是一种面向过程的语言，但在学习WebGIS时，我们主要需要理解面向对象的概念，其次也需要了解函数、类等概念。

一般来说，GIS专业的本科生，通过大学课程的学习，已经掌握了一些 GIS 的理论知识，如：地理信息系统的组成、地理空间数据获取、地理空间数据表达、地理空间数据处理、地理空间数据管理、地理空间数据分析、地图制图与空间可视化等。

同时，也掌握了一些桌面GIS软件，例如ArcGIS、ArcMap的使用。

所有这些理论知识为将来学习WebGIS奠定了基础。

如果有不了解GIS相关的基本知识，很难进行GIS开发；与此同时，WebGIS本质上是基于Web端的地图可视化应用，因此，我们还需要了解Web的基本概念和相关知识。

03 WebGIS的入门知识

学习WebGIS开发时，我们首先要接触的是Web端开发语言，可能说到这里，很多小伙伴都知道，我们要学习HTML、CSS和JavaScript等前端编程语言。

1）HTML\CSS

其中，HTML和CSS相对简单，比较容易上手。

大家可以利用新中地给出的智慧校园、智慧交通等包含前端编程的课程熟悉这几种语言。

学完以后，我们可以很快掌握如何搭建一个网站，并在项目中用我们搭建的网站实现一些功能。

2）JavaScript

学完HTML\CSS，接下来就是JavaScript，JS相对较难，需要我们花费更多的精力学习。

JS也是我们需要重点掌握的内容，因为如果不熟练掌握JavaScript，后续将很难在项目中进行灵活运用。

JS作业：

新中地天气网页

可视化作业

到此，大家一定对这些语言有一定的了解。

接下来，就能初步了解WebGIS开发的基本知识。

当然，后续我们还需要学习更多内容，因为WebGIS开发有很多形式。例如，有些人使用ArcGIS for JS API进行开发，有些人使用OpenLayers，还有人使用Mapbox GL或Cesium。

虽然上述内容的开发形式不同，但都属于WebGIS开发，并且都是通过调用封装好的类、属性和方法来实现的，其底层逻辑是可以融会贯通的。

看到这里，相信新手已经对自己要学习的内容有所了解。那么具体应该怎么学习呢？

这里推荐小白从下面两个项目入手：

1）智慧校园：零基础可学实战项目

第一章GIS开发概述

第1节-什么是GIS开发

第2节-WebGIS开发

第3节-如何学习webGIS开发

第4节-GIS平台

第5节-术语与名词

第二章开发环境搭建

第1节-开发软件

第2节-高德开放平台

第三章Web开发篇

第1节-HTML快速入门

第2节-CSS快速入门

第3节-JavaScript快速入门

第四章WebGIS开发

第1节-开发准备

第2节-地图显示

第3节-地图控件

第4节-点标记

第5节-几何计算

第6节-GeoJSON

第五章实战案例

第1节需求分析

第2节设计方案

第3节具体实现

+文末小助手，备注【智慧校园】无偿领取

2）智慧交通实战项目

+文末小助手，备注【智慧交通】无偿获取

04 WebGIS框架

这一点我们之前重点讲过，没看过的小伙伴可以看下面的详细介绍：

这里我大致提一下，WebGIS开发的引擎分为四大类：

1）Charts可视化图表

主要负责可视化功能，以D3.js，Echarts等为代表。

2）LBS地图开放平台

LBS就是Location Based Service，国内的LBS以高德/谷歌/百度/天地图等为代表。

3）WebGIS商业API

这类也是工作中比较常见的，例如ESRI的ArcGIS API For JS，超图的IClient，中地数码的MapGIS Client for JS，都属于商业API。

4）WebGIS开源API

开源框架是目前使用最多最广泛的，比较出名的就有Leaflet，OpenLayers，Cesium，MapboxGL等。

根据目前就业需求来看，大多数企业要求会开源框架，因此我们学习也以开源框架为主，那这里又主要分为二维和三维框架。二维包括openlayers、leaflet等；三维包括mapbox以及threejs、cesium等。下面一一进行介绍。

二维框架：openlayers

openlayers是最所有初学者必须要掌握的第一个框架。下面是openlayers的知识图谱，来源网络：

从上图中可以看出，OpenLayers 实现了上百个类，用于对GIS中的各种事物进行抽象表达。

其中 Map，Layer，Source 和 View 是 OpenLayers 框架体系中的核心类，几乎所有动作都围绕这几个核心类展开，以实现地图加载和相关操作.

在Openlayers的体系框架中，把整个地图看作一个容器（Map），核心为地图图层（Layer），每个图层有对应的数据源（Source），并由地图视图（View）进行地图表现。地图容器上还支持一些与用户交互的控件（Control 和 Interaction），另外 Openlayers 还支持事件机制。

总之，OpenLayers 使得在任何网页中放置动态地图变得很容易。它可以显示贴图，矢量从任何来源载入的数据和标记。OpenLayers 已经被开发来进一步使用各种地理信息。它是完全免费的开源JavaScript。

openlayers开发学习教程：

之前我们说过，Mapbox是二三维结合的一款框架，也是三维框架里面最容易入手的一个。

三维框架Mapbox

官网：https://www.mapbox.com/

Mapbox是⼀个可以创建各种自定义地图的网站，如 Pinterest、Evernote、Github、500px 等大牌都使用Mapbox创建地图。

Mapbox宣称要构建世界上最漂亮的地图。

已为Foursquare、Pinterest、Evernote、⾦融时报、天⽓频道、优步科技等公司的网提供了订制在线地图服务。

Mapbox针对不同平台均开发了相应的GIS引擎以满⾜开发者或相关用户的需要，如：iOS SDK（⽤于iOS端开发）、Android SDK（用于Andriod端开发）、Navigation SDK（用于Navigation端开发）、Unity SDK（用于Unity端开发）、GL JS（用于web端开发）。

不同平台的SDK，除使用⽅式不同外，功能特性上也多多少少存在不同。此外，Uber还针对react开发了 react-map-gl。

总的来说，Mapbox的开源技术栈是⾮常全面的。

完整版PDF+视频教程+源码

+文末小助手，备注mapbox无偿获取

 

三维框架：cesium

Cesium是一款使用JavaScript开发的基于WebGL的，能够实现三维地球和地图可视化的JS库。

Cesium支持海量的三维模型数据、影像数据、地形高程数据、矢量数据等丰富的地理数据的加载。在交通，规划，城市管理，地形仿真等领域有非常广泛的应用。

前面也给大家反复介绍过cesium，它是目前功能最齐全的三维GIS开发框架，也是在就业过程中，企业最看重、面试最容易被考核的一个。

初学者刚接触Cesium时，看到它的文档，可能会被震惊到。

毕竟cesium库中的类实在是太多，每一个类又有大量的函数和属性，而且官网的文档又是英文，这给我们学习GIS开发的同学带来了极大的困扰。

cesium.js库

但是接触多了，我们会发现，其实Cesium开发文档里边的好多类属性和方法都是一样的。比如，在Cesium中，一个非常重要的类是Viewer。

如果要使用Cesium创建一个三维窗口，几乎无法避免使用Viewer类。因为它代表了Cesium的三维窗口。

标志性建筑

全局飞线