东营市网站建设_网站建设公司_前端开发_seo优化

新手人群

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

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

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

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

这里重点讲述作为3S专业的学生学习WebGIS的方法和路线。

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

• C语言程序设计与开发

• 地理信息系统概论

• GIS 设计与开发

• 面向对象设计与开发

• 网页设计与制作

• 人工智能与专家系统

• 遥感地学分析

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

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

编程语言和基础

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

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

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

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

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

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

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

WebGIS的入门知识

前端三件套

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

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

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

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

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

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

Vue.js

Vue.js被定义为一个渐进式的框架。

框架，即framework。其实就是某种应用的半成品，也就是一组组件，程序员可以选用各种框架来完成自己的目标系统。

简单说就是使用别人搭好的舞台，你来做表演；而且，框架一般是成熟的，不断升级的软件。

回到VUE，因为它的几个特性，例如使用简单、规模庞大、速度快和功能广泛，vue的需求量已经很大，是目前前端最流行的框架之一。

Vue的特点在于，相比其他框架，vue的学习曲线短、文档详细，可以提高开发效率，已经成为了前端工程师必不可少的技能之一。

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

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

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等。

WebGIS开源框架详解：

openlayers

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

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

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

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

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

Mapbox

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

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

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

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

Mapbox基本架构

Mapbox GL JS (mapbox graphics library javascript）的核心特点是客户端渲染，在Mapbox GL JS中创建web应用时，通过Javascript和WebGL把地图作为 vector tiles（矢量瓦片）进行渲染。

相比将服务器的一系列切片图片组合起来再显示，Mapbox GL JS 渲染可以快速改变样式，使得地图的呈现更加多样化。

Mapbox知识图谱

Cesium

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

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

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

Cesium是一个跨界SDK，涉及三个知识领域

◆Web前端

◆计算机图形学

◆地理信息系统 (GIS)

编辑

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

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

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

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

如果你对GIS开发感兴趣，这里有海量的webgis开发实战案例和课程，不管你是0基础初学者，还是想深入学习进阶提升，这里都能找到适合你的内容。

新中地有哪些适合你的教程？

0基础教程：

适合毫无前端基础，完全没有接触过编程的同学从0开始学习。

• 智慧校园

• 智慧交通

弱基础同学：

适合有一定前端基础，没有接触过组件化开发以及对webgis框架不熟悉的的同学，可以进一步提升对前端框架以及GIS开发框架的熟练度。

• VUE教程

• 智慧机场

• 智慧地铁

• openlayers系列课程

• mapbox系列课程

• cesium系列课程

• threejs实战教程

进阶教程：

适合有较高的前端以及webgis编程基础，且有良好的三维gis开发基础，了解cesium编程的基础知识，想进一步细化和提升编程能力的同学。

• cesium高阶教程

• promise异步编程

不管你是学生，想制作webgis相关的项目完成期末作业，或想趁这个寒假，入门GIS开发，与其他人拉开距离；

还是打工人，想加强自己的编程能力，转行GIS开发，明年给自己一个新的开始。

上述webgis精品教程千万不要错过哦！

+下方↓↓小助手