分享

WebGIS 开发人员的学习指南

 风声之家 2023-08-13 发布于江苏

2023-08-12 21:29 发表于湖北

下面的流程图总结了成为 Web GIS 开发人员的整个学习指南。

1. 从 GIS 和 GIS 软件开始

Web-GIS 可以被视为 GIS 的变体,因此深入了解 GIS 本身的含义是很方便的。强烈建议您了解 GIS 软件,因为这些软件有助于使我们的开发工作更轻松、更快,它们还可以充当测试环境。大多数这些软件的基本概念都是相同的,因此不要回避 GIS 的基础知识,这一点很重要。它与学习编码一样重要,因为这些知识将帮助您做出决策、做正确的事情并遵循最佳实践。建议:学GIS、玩QGIS一个月左右。

资源:

  • QGIS教程 https://www./en/docs/3/building_a_python_plugin.html
  • 地理信息系统简介 https://mgimond./Spatial/introGIS.html
  • 书籍:GIS 基础知识 https://www.amazon.com/GIS-Fundamentals-Geographic-Information-Systems/dp/1593995520

2.然后选择HTML和CSS

HTML 是一种用于在 Web 浏览器中显示的文档的标记语言。HTML 用于创建页面并使其发挥作用。CSS 是用于创建 HTML 视觉外观的样式表语言。HTML 和 CSS 易于理解,易于编辑,所有浏览器都支持。您可以使用 HTML 和 CSS 创建页面(例如登录/注册页面、联系我们页面)并在其上构建小型项目(例如 facebook 登录页面、youtube 克隆等)。建议:  在一两周内学习 HTML 和 CSS 的重要概念。资源:以下是一些学习 HTML 和 CSS 的有用资源和项目:

  • W3schools HTML (https://www./html/default.asp
  • W3schools CSS https://www./html/default.asp
  • 创建联系表格(YouTube 视频)https://www./watch?v=Db5jCkrVgAw
  • 使用 Flexbox 创建导航栏(youtube 视频)https://www./watch?v=PwWHL3RyQgk
  • 制作facebook登录页面(youtube教程)https:///UqYjdaCfgvE

3.学习JavaScript

JavaScript 有助于向 HTML 和 CSS 页面添加交互性。它主要用于客户端目的。如今,人们在服务器端(NodeJs)、游戏开发(EaseJs)和移动应用程序开发(React Native)中使用它。但对于Web-GIS开发者路线图,您只需要了解它在Web开发上的应用即可。这意味着仅限客户端和服务器端。JavaScript 帮助我们将逻辑放入页面的呈现中。单击按钮即可显示或隐藏更多信息、放大或缩小地图、在页面上显示动画等是 JavaScript 的一些用例。建议: 再学习 2 周或更长时间的 JavaScript 基础知识。以下是一些学习 JavaScript 的有用资源和项目:

  • W3schools JavaScript https://www./js/default.asp
  • 17 个适合初学者的 JavaScript 项目 https:///javascript-projects-for-beginners/
  • 学习 JavaScript 免费代码营 https://www./watch?v=PkZNo7MFNFg

4. 了解地图库和其他所需的实用程序

Web GIS 门户中最常见的需求是数据可视化界面。借助地图库可以轻松构建数据可视化界面。以下是一些最常用的地图库的列表;

  • LeafletJs (https:///) 它是开源的、轻量级的 javascript 库
  • OpenLayers:(https:///) 它也是一个开源 JavaScript 库(相关:OpenLayers:地理空间 JavaScript 库(https://www./openlayers-geospatial-javascript-library/))
  • Mapbox:(https://www./) 这是一家美国网站定制在线地图提供商。它不是完全免费的。
  • Google Map API:(https://developers.google.com/maps) 是 google 提供的网络地图 API。它也不是完全免费的。
  • Turf JS(https:///):浏览器和 Node.js 的高级地理空间分析。

您可以选择上述库之一来实现空间数据的可视化。您不需要学习上面列出的所有库。我们建议您学习leaflet或OpenLayers。除此之外,您还可以学习一些其他实用程序,例如 bootstrap、  jquery。这些实用程序是完全可选的。您也可以在仅阅读地图库后继续学习。但是,如果您了解这些实用程序,那么将有助于快速轻松地开发界面。建议:再学习 3 周的地图库。与其学习所有库的基础知识,不如掌握其中一个。如果您还考虑学习其他实用程序,请多花几天时间来学习。以下是一些可以帮助您提高知识的项目想法

  • 将行政边界数据集(区、地区等)可视化为地图
  • 构建Web-GIS基本工具(例如获取坐标、获取当前位置、全屏视图、自定义放大/缩小按钮等)
  • 创建地理空间数据可视化的简单门户

资源:

  • 从基础到高级的leafletjs(YouTube 播放列表)https:///playlist?list=PLyWyQBSWLw1NH1wsA0wkSMTlQ45P0AqCj
  • leafletjs教程https:///examples.html
  • openlayers教程 https:///doc/tutorials/
  • Qgis2Web教程 https://www./en/docs/web_mapping_with_qgis2web.html
  • 所需库的官方网站

5. 现在是时候开始使用地图服务器了

对于发布少量的地图数据集,学习地图库就足够了。但当您拥有来自不同来源的大量数据时,复杂性就会增加。为了解决这样的问题,我们需要一个网络地图服务器。地图服务器是能够轻松管理大量地理空间数据集并提供网络地图服务(WMS)、网络要素服务(WFS)、网络覆盖服务(WCS)等开放地理空间联盟(OGC)标准服务的服务器。最常用的地图服务器之一是 geoserver。geoserver是一个用于共享、处理和编辑地理空间数据的开源服务器。以下是一些最常用的地图服务器的列表:

  • GeoServer(http:///)  :用于共享地理空间数据的开源服务器。
  • MapServer(https:///)  :Mapserver是一个开源平台,用于发布空间数据和向网络发布交互式地图应用程序。
  • GeoTool(https:///)  :开源 java GIS 工具包。
  • GeoNetwork(https:///)  :用于管理空间参考资源的目录应用程序。
  • GLG 地图服务器(http://www./) :Generic Logic Inc. 是为世界各地的软件开发商提供实时图形、数据可视化、HMI Scada 和定制 GIS 解决方案的主要提供商。
  • Open Map Tiles(https:///)  :一个自行托管开源地图的平台。
  • Deegree(https://www./)  :用于空间数据基础设施和地理空间网络的开源软件。

在这个阶段最好也了解 OGC 标准。(https://www./docs/is)只有了解 OGC 定义的标准后,您才能构建更好的 Web GIS 平台。建议:您应该花费至少 3 周的时间来学习 Web 地图服务器。花更多时间了解 OGC 标准及其使用。详细学习geoserver及其应用。

资源:

  • GeoServer 和 Leaflet Web-GIS(Youtube 播放列表)(https:///playlist?list=PLyWyQBSWLw1OS7HojnpX6aogfm7LtF39S)
  • GeoServer 文档(推荐)(https://docs./)
  • GeoNetwork文档(https:///docs.html)
  • OGC标准(https://www./docs/is)

6.了解数据库和后端

对于网络地图和简单的应用程序,最多执行第 5 步就可以了。但如果是大型应用程序,您还需要数据库和后端。一般来说,数据库用于存储地理空间数据,后端用于查询和获取任何 Web 应用程序中所需的信息。后端可以控制逻辑并将其发送到 Web 应用程序。有许多专门用于后端的编程语言和框架。最流行的语言是 python、php、javascript、java、ruby、rust 等。最流行的框架是 django、laravel、ruby on Rails、flask、expressjs、spring 等。您可以先选择一种语言,然后再学习框架。假设你想学习django(Python框架),之前你需要花一些时间学习Python。在这个阶段,你至少应该了解以下几点:

  • 关于结构化查询语言 (SQL)
  • 关于 API(GET、POST、PUT、DELETE)请求
  • 至少开发一个创建、读取、更新、删除 (CRUD) 项目
  • 关于对象关系映射 (ORM)
  • 使用 PostGIS 及其扩展,例如 PG Routing

现在,您可以使用后端连接地图服务器并创建交互式 Web-GIS 门户。GeoJSON 序列化器、使用 PostGIS 数据库的 GeoSpatial 数据可视化门户等是 Web GIS 上的一些初级后端项目。建议:了解 Django。你应该花至少3周的时间学习数据库(推荐PostGIS/PostgreSQL组合)、空间SQL和后端技术。

资源:

  • Spatial bookmarking note(Youtube 播放列表)(https:///playlist?list=PLyWyQBSWLw1OUfqcPzO6AceuGpC5gr-_n)
  • Web 制图和 Web GIS 简介(Udemy 课程)(https://www./course/introduction-to-web-mapping-and-web-gis-2020-geodjango/?referralCode=72E09BDD6D9C8ECE2169)
  • Web 地图和 Web-GIS 从开发到部署 2021:GeoDjango(Udemy 课程)(https://www./course/web-mapping-and-web-gis-from-dev-to-deploy-2021-geodjango/?referralCode=14893C9BD7E7D959F865)
  • 使用 Django 和 GeoDjango 制作基于位置的 Web 应用程序(博客)(https:///location-based-app-with-geodjango-tutorial/)
  • QGIS 和空间数据库(https://jeafreezy.v/section-4-qgis-and-the-spatial-databasepostgis-ckoln6gzi0a5r2gs1axaocrm3)
  • 伟大的 Quiseng Wu 的深入研究 Spatial SQL 和 PostGIS 的播放列表!(https://www./watch?v=fgS1eVPPBiElist=PLAxJ4-o7ZoPcvp0ETujkLVCmKIGj-YvlG)
  • PostGIS官方介绍(https:///workshops/postgis-intro/introduction.html)
  • Crunchy Data 的互动学习平台(https://learn./training/postgis)
  • Geodjango 播放列表(https://www./watch?v=pxX6gI48eh4)

7.学习前端框架(附加)

前端框架有助于确定与 Web 应用程序交互时在屏幕上看到的每个元素的逻辑、结构、设计、行为和动画。前端框架可以轻松更快地构建网页。我们可以将其视为附加内容,因为我们无需学习任何前端框架即可构建 Web-GIS 应用程序。javascript 上最流行的前端库如下,

  • React(https:///):React 以基于组件的结构构建 UI。它由 Facebook 支持和维护。
  • Vue(https:///):Vue 以模型-视图-视图模型结构构建 UI。它没有得到任何大公司的支持,但世界各地的许多开发人员都在维护它。
  • Angular(https:///):Angular 以 MVC 模式构建 UI。它由谷歌支持和维护。

建议:应该花至少两个月的时间来学习所选的前端框架。

资源:

  • 2021 年 10 强 webGIS UI(https:///KULAc4P1Sh4)
  • reactjs文档(https:///docs/getting-started.html)
  • reactjs课程(https:///community/courses.html)

最后

我们整理的清单并不是全部。我们都知道地理空间行业每天都在不断发展,有一些我们没有发现到的新兴技术,例如:数字孪生、增强现实 (AR)和虚拟现实 (VR)、时空资产目录 (STAC)、云优化 Geotiffs (COG)、Google 地球引擎、微软行星计算机以及更多地球观测工具和技术。

本文的目的不是让您对趋势技术感到不知所措,我们相信您会随着进步而了解它们。先开始吧!

测绘数据分析

测绘数据分析主要是对遥感RS、全球定位系统GNSS 和地理信息系统GIS等数据的分析处理!

78篇原创内容

公众号

以上内容包含广告

阅读

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多