WebGIS开发的常见框架及优缺点

WebGIS开发引擎的发展历程:

内容来自公众号:Spatial Data

地图API分类

WebGIS系统通常都围绕地图进行内容表达,但并不是有地图就一定是WebGIS,所以下面要讨论下基于Web的地图API分类及应用场景。Web上的Map API主要分类:

01 Charts可视化图表

主要负责可视化功能,以D3.js,Echarts等为代表。我们常见的WebGIS开发地图周围有一些可视化的图标,就是通过这些可视化图表实现的。

02 LBS地图开放平台

LBS就是Location Based Service,指的是通过电信移动运营商的网络(如GSM网、CDMA网)获取移动终端用户的位置信息(经纬度坐标),在电子地图平台的支持下,为用户提供相应服务的一种增值业务。

LBS技术已经成为移动互联网不可或缺的基础能力,但对于大部分开发者来说,自建LBS能力的门槛很高——需要具备地图测绘资质,拥有足够的地图数据采集和后端云数据处理能力。国内的LBS以高德/谷歌/百度/天地图等为代表。

03 WebGIS商业API

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

添加图片注释,不超过 140 字(可选)

Google Maps、ESRI、国内的超图、中地等公司都创建了企业级数据和 API,但是通常使用软件、库、包,这些通常需要购买才能使用。这些库的优点是这些库是由专门的开发人员创建的,因此这些库非常稳定并且有据可查。而且是安全且可扩展的,因此成为大公司的优先选择。他们的缺点是成本很高,特别是一家初创公司或小公司,与其他成本相比,光使用企业API,成本就已经非常高了。除此之外,开发人员需要依赖公司发布新功能,因为它的源代码不共享。

04 WebGIS开源API:

今天要讨论的重点来了,开源框架是目前使用最多最广泛的,比较出名的就有Leaflet,OpenLayers,Cesium,MapboxGL等。开源API最大的优势就是免费,并且可以根据任何商业或非商业应用程序的需要,更改源代码,以实现需要的功能,使其成为您自己的产品并进行售卖。所以很多小型初创公司,或者预算不多的公司,都选择使用开源项目,这样的库、包和软件也存在于GIS领域。他们的缺点是由于这些都是基于社区的,所以并没有专门的技术支持。通常为了构建这样的产品,开发人员使用现有的开源产品,因此,当一旦涉及到新版本发布时,工作就会变得复杂。开源和企业API对比如下图所示:

下面主要介绍几款开源API和他们的优缺点。

1. LeafLet

Leaflet是一个轻量级二维开源JavaScript地图数据库。

Canvas渲染机制,仅支持二维表达,地图坐标系墨卡托投影,不支持球,特点是入手简单,缺陷是不支持webgl渲染性能有瓶颈,适用于轻量级简单地理信息主题可视化。

WebGIS开发需要重点学习JS的核心概念,使用Leaflet JavaScript构建基于地图的应用程序,并将学习的内容放到实际应用。当然,学习JS的前提是先掌握Web前端编程的内容,否则会很乱。

2. Openlayers

Openlayers也是一个开源二维地图数据库,支持canvas和webgl两种方式渲染地图,默认采用的是canvas。仅支持二维表达,不限制坐标系,不支持球。

OpenLayers的存在也是为了方便进一步利用各种地理信息进行开发,可以显示从任何源加载的地图分幅、矢量数据和标记,它将动态地图放置到网页中,适合传统webGIS开发。

目前企业不满足于Openlayers的二维功能,更青睐三维地图引擎。

也就是我们下面要重点讨论的。

3. Mapbox

Mapbox是一款二三维结合的开源地图数据库,mapbox和cesium相比更美观,与openlayers相比支持三维。

Mapbox是二三维一体化,墨卡托坐标系,明星数据格式是矢量切片,特点是最具美感的专题地图,适用于互联网场景复杂地理信息表达,内网追求地图可视化效果的也适用,Mapbox很多优化都是基于互联网场景的。

Mapbox类似于一个leaflet的加强版,它专注于Mobile与Web应用的地图体验,有自己定义的地图样式、地图业务,该公司也创建开源了很多的开源工具,同时也专注于Web GL方向,比如Mapbox GL在3D GIS渲染上效果很好。

新中地学员作品

Mapbox能做什么:

  • 能通过各种投影系进行地图瓦片的投影。

  • 支持在地图瓦片上叠加各种图层,支持 geojson、图片、文本 等多种信息在图层上进行加载显示。

  • 支持自定义 Style (矢量瓦片)

  • 支持 2.5D 视角旋转及显示

  • 支持加载 3D 模型

  • 支持通过 DOM 的方式添加 HTML 元素

  • 支持 web-gl 能力进行图形渲染

  • 支持进行 3D 形式的球星地理渲染和星空背景渲染

尤其是其 "2.5D 视角旋转及显示"、"加载 3D 模型" 这两点,是非常亮眼的,相比于 OpenLayers 和 Leaflet 这两款竞品,这也是它最为吸引人的地方所在。

4. Cesium

Cesium是一个三维可视化地图库,WebGL渲染机制。它支持2D\2.5D\3D形式的地图展示;可以绘制各种几何图形、高亮区域,支持导入图片,甚至3D模型等多种数据可视化展示;还可用于动态数据可视化并提供良好的触摸支持,支持绝大多数的浏览器和mobile端。

此外,Cesium还支持基于时间轴的动态数据展示cesium二三维一体化,经纬度坐标系,支持球。

cesium的明星数据格式是3DTiles,特点是唯一开源的WebGIS三维引擎,缺陷是卡,体验差,地图丑。

可能是为了支持球,所有的平面瓦片都要进行纹理转换贴球,计算量偏大,最新的矢量切片也是变成图片再纹理转换到球上,栅格化严重一点都不精美,可以说为了球,牺牲了太多性能和地图美观度,适用于Web强三维应用场景。

Cesium城市建筑规划

Cesium支持的数据格式:

  • 影像数据:Bing、天地图、ArcGIS、OSM、WMTS、WMS等

  • 地形数据:ArcGIS、谷歌、STK等

  • 矢量数据:KML、KMZ、GeoJSON、TopoJSON、CZML

  • 三维模型:GLTF、GLB(二进制glTF文件)

  • 三维瓦片:3D Tiles(倾斜摄影、人工模型、 三维建筑物、CAD、BIM,点云数据等)

Cesium能做什么:

  • 支持2D,2.5D,3D 形式的地理(地图)数据展示

  • 可以绘制各种几何图形、高亮区域,支持导入图片,甚至三维模型等多种数据可视化展示

  • 可用于动态数据可视化并提供良好的触摸支持,支持绝大多数的浏览器和移动端浏览器

  • 支持基于时间轴的动态流式数据展示

在WebGIS 3D领域,比较有争议性的是cesium与mapboxgl。简单来说,两者都是二三维一体化的GIS引擎,但产品侧重点不同 ,Cesium追求的三维功能全面,Mapbox追求用户体验。

Cesium和Mapbox的优缺点

CesiumGL的优点>>

1)全局视图支持

Cesium支持三维地球视图模型,能够通过更改视角和位置在虚拟环境中自由移动,支持地球表面的不同视图。

2)纯3D

与Mapbox不同,Cesium是开箱即用的3D,允许多个角度旋转和可视化对象。

Cesium缺点>>

1)占内存

与Mapbox相比,Cesium的SDK大小相对较大,最新的Cesium.js版本大约79.4 MB。

2)加载慢

在7.2Mbps网速下,更新速度约为3秒或以上。

Mapbox优点>>

1)地图样式多

Mapbox提供了很多不同的地图样式,可以直接使用,也可以自定义样式。

2)加载速度快

Mapbox比Cesium更新地图更快,在稳定的7.2Mbps互联网连接下,加载时间不到2秒。

3)更精细的建筑信息

相比Cesium,Mapbox提供了对3D建筑信息的支持。

下图是Mapbox中3D建筑的一个例图,可以看到清楚地提供了周围建筑的信息,导航地图会更加容易。

下面是Cesium中类似3D建筑的示例。这里没有建筑信息,这会使导航地图变得更加复杂。

Mapbox缺点>>

1)使用复杂

Cesium使用3D开箱即用,Mapbox使用2.5D,使得使用其他第三方库(如Three.js)收集和组合多个3D对象时流程有点复杂。

2)3D功能较弱

相比于 Cesium,Mapbox无法支持“地下管网开挖”这种形式的页面展示;3D支持上能力比较弱。此外,mapbox账号注册十分麻烦。

更多WebGIS开发教程:

免费领取GIS开发相关学习资料

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/595476.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

网络基础面试题(一)

1.ICMP是什么协议?处于哪一层? ICMP(Internet Control Message Protocol)是一种网络协议,用于在IP网络中传递控制消息和错误报告。它是在IP协议之上运行的协议。 ICMP主要用于在网络中的不同主机和路由器之间传…

基于Java+SpringBoot+vue+elementUI私人健身教练预约管理系统设计实现

基于JavaSpringBootvueelementUI私人健身教练预约管理系统设计实现 欢迎点赞 收藏 ⭐留言 文末获取源码联系方式 文章目录 基于JavaSpringBootvueelementUI私人健身教练预约管理系统设计实现一、前言介绍:二、系统设计:2.1 性能需求分析2.2 B/S架构&…

typora的笔记丢失了怎么办?

突然打开电脑发现原本保存的typora的笔记全部不见了,头痛…… 解决方法:点击typora中的文件,选择偏好设置,点击[恢复未保存的草稿],然后可以在文件夹中找到最后一次保存该文件的版本。 自己又将自动保存勾选上了&…

向爬虫而生---Redis 拓宽篇1 < pipeline传输效率>

前言: 都知道,Redis是一款高效的内存数据库;每条命令都能很快响应,但是如果我们把服务器布在网络上,每次一个命令来回传送也是需要花费时间的; pipeline传输技术则是进一步提高Redis的性能和传输效率的一种方法。 正文: pipeline与普通命令发送方式的区别 Pipeline是一种机制&…

SQL中 Group by Grouping Sets 分组的用法

文章目录 1. 用法2. 语法3. 实际应用3.1 求总和与小计3.2 按多个维度分组3.3 标记小计和总计 1. 用法 将Grouping Sets 运算符添加到Group by 子句中,使用Grouping Set 可以在一个查询中指定数据的多个分组,其结果与针对指定的组执行union all 运算等效…

基于LLM+RAG的问答

每日推荐一篇专注于解决实际问题的外文,精准翻译并深入解读其要点,助力读者培养实际问题解决和代码动手的能力。 欢迎关注公众号 原文标题:LLMRAG based Question Answering 原文地址:https://teemukanstren.com/2023/12/25/llm…

14.7-时序反馈移位寄存器建模

时序反馈移位寄存器建模 1,阻塞赋值实现的LFSR,实际上并不具有LFSR功能1.1.1,RTL设计,阻塞赋值1.1.2,tb测试代码1.1.3,波形仿真输出,SIM输出,没实现LFSR1.2.1,RTL设计&am…

imgaug库指南(二):从入门到精通的【图像增强】之旅

文章目录 引言前期回顾代码示例小结结尾 引言 在深度学习和计算机视觉的世界里,数据是模型训练的基石,其质量与数量直接影响着模型的性能。然而,获取大量高质量的标注数据往往需要耗费大量的时间和资源。正因如此,数据增强技术应…

【零基础入门TypeScript】TypeScript - 概述

目录 什么是 TypeScript? TypeScript 的特点 TypeScript 和 ECMAScript 为什么使用 TypeScript? TypeScript 的组件 声明文件 JavaScript 是作为客户端语言引入的。Node.js 的发展也标志着 JavaScript 成为一种新兴的服务器端技术。然而&#xff0…

婴儿专用洗衣机哪个牌子比较好?高性价比婴儿洗衣机推荐

随着家中新生命的降临,一大批婴儿专用的物品也陆续进入到家中,虽然有很多东西确实能在育儿之路上提供很多帮助,不过也有一些东西“很坑”。婴儿洗衣机这一产品是专为有婴幼儿的家庭或者有特殊需求的人士所研发的,它的容量以及体积…

【教学类-43-15】 20240103 (5宫格数独:内存数据不够计算) 不重复的基础模板数量:未知

背景需求: 测试5宫格有多少种不重复的基础模板(只测试所有的25数字一组有多少个) # 测试11*11格,2*2一共4套3*3 宫格目的:数独14 5宫格有不同的基础模板 作者:阿夏 时间:2024年01月04日 13:…

unity学习笔记----游戏练习04

一、开发阳光生产功能 向日葵的生产过程需要动画和时间 1.生产动画 选中Sunflower,然后选中窗口再选中 创建新的剪辑开始制作动画,向日葵生产动画的过程是一个从暗到亮然后持续一段时间再到暗的过程。因此只需要在对应的时间改变颜色即可。 为了保证是…

pytest装饰器 @pytest.mark.parametrize 使用方法

pytest.mark.parametrize 有三种传参方法,分别是: 1.列表传参:将参数值作为列表传递给装饰器。 pytest.mark.parametrize("param", [value1, value2, ..., valuen])2.元组传参:将参数值作为元组传递给装饰器。 pytes…

使用IDEA创建使用 JDK8 的 2.x.x 版本的 Spring Boot 项目以及 Spring Boot 项目如何修改JDK版本

目录 一、在阿里云上官网上创建项目 二、将 IDEA 中创建项目的源地址修改为阿里云官网 三、创建 3.x.x 的项目之后修改配置降低至 2.7.x 版本和使用 JDK8(修改 Spring Boot 的 JDK 版本同理) 从上面的 Spring Boot 官网的截图中可以发现,自…

什么是机器学习?

国际机器学习大会的创始人之一 Tom Mitchell 对机器学习的定义是: 计算机程序从经验 E 中学习, 解决某一任务 T, 进行某一性能度量 P, 通过 P 测定在 T 上的表现因经验 E 而提高. 特征(feature), 自变量标签(label), 因变量 y验证数据集(validation dataset)测试数据集(test d…

爬取豆瓣电影top250的电影名称(完整代码与解释)

在爬取豆瓣电影top250的电影名称之前,需要在安装两个第三方库requests和bs4,方法是在终端输入: pip install requestspip install bs4 截几张关键性图片: 豆瓣top250电影网页 运行结果 测试html文件标签的各个方法的作用&#xf…

总结HarmonyOS的技术特点

HarmonyOS是华为自主研发的面向全场景的分布式操作系统。它的技术特点主要体现在以下几个方面: 分布式架构:HarmonyOS采用了分布式架构设计,通过组件化和小型化等方法,支持多种终端设备按需弹性部署,能够适配不同类别的…

基于SpringBoot的经方药食两用服务平台的设计与实现

文章目录 项目介绍主要功能截图:部分代码展示设计总结项目获取方式🍅 作者主页:超级无敌暴龙战士塔塔开 🍅 简介:Java领域优质创作者🏆、 简历模板、学习资料、面试题库【关注我,都给你】 🍅文末获取源码联系🍅 项目介绍 基于SpringBoot的经方药食两用服务平台的…

深入理解HTTP状态码

HTTP(Hypertext Transfer Protocol)是一种用于传输超文本的应用层协议,它通过客户端和服务器之间的请求和响应进行通信。在HTTP交互中,状态码(Status Code)是服务器用来表示请求处理状态的三位数字代码。这…

wy的leetcode刷题记录_Day71

wy的leetcode刷题记录_Day71 声明 本文章的所有题目信息都来源于leetcode 如有侵权请联系我删掉! 时间:2024-1-3(补) 前言 目录 wy的leetcode刷题记录_Day71声明前言2487. 从链表中移除节点题目介绍思路代码收获 509. 斐波那契数题目介绍思…