当前位置:网站首页>WebGIS框架---kalrry
WebGIS框架---kalrry
2022-07-04 21:16:00 【kalrry】
WebGIS框架---kalrry
一、简介
首先了解,WebGL是一种3D绘图协议,只是一个标准,基于此标准,你可以写出MapBox-GL,也可以写出three-GL等框架,它们都是关于web端渲染三维图形的(渲染)引擎
论难度,thingjs(框架)<threejs(引擎)<webgl(接口)
基于WebGL的3D技术在网页中的运用 ThingJS常通过arcgis发布二维地图或者三维地图,然后在客户端调用json实现webgl渲染。
二、为什么我们需要WebGL?
因为html5虽然支持Canvas,但是只能在上面绘制二维图形,所以需要WebGL来绘制三维图形。
三、为什么有了WebGL还需要mapbox-gl和three-gl?
因为WebGL基础类库就像C++里面的基础函数一样,还需要再封装一层,才能提供给各种用途的3D用户使用。
四、WebGIS框架
1、OpenLayers----开源-2D
2、Leaflet----开源-2D
官网
Leaflet 是一个为移动设备地图地图而开发的现代的、开源的JavaScript 库。它是由 Vladimir Agafonkin 带领一个专业贡献者团队开发,虽然代码仅有 38 KB,但它具有开发人员开发在线地图的大部分功能。常用于2D地图渲染
3、Arcgis----收费
- 简介
官网
ArcGIS 是一个全面的系统,用户可用其来收集、组织、管理、分析、交流和发布地理信息。作为世界领先的地理信息系统 (GIS) 构建和应用平台,ArcGIS 可供全世界的人们将地理知识应用到政府、企业、科技、教育和媒体领域。ArcGIS 可以发布地理信息,以便所有人都可以访问和使用。本系统可以在任何地点通过 web 浏览器、移动设备(例如智能手机和台式计算机)来使用。 - 参考
参考1
4、Cesium----开源—优先选择这个
简介
介绍
官网
第三方中文网
Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以及多平台,易用性上都有高质量的保证。如何使用
//1、npm方式安装
npm install cesium
//2、或者直接官网下载
[官网下载](https://cesium.com/downloads/)
5、Mapbox----开源
- 简介
中文官网
官网
Mapbox致力于打造全球最漂亮的个性化地图。
在一次偶然的地图相关资料搜索过程中发现了一个很神奇又很漂亮的地图,这个地图支持高度自定义各种地图元素,比如,道路,水系,绿地,建筑物,背景色,等等。Mapbox打造的Mapbox studio地图制作虚拟工作室,就是一个很完美的地图元素个性化编辑器。另外,我们也可以把自己项目的地理信息数据上传到Mapbox云端,然后在自己项目的客户端展现出来。
Mapbox地图数据来源于Open Street Map(OSM)等其他地图数据供应商,和Google Map、Apple Map等地图厂商的地图数据来源差不多。 - 参考
教程参考
五、环境搭建
1、前言
WebGIS开发的形式有很多,比如有人用的是Arcgis for JS api开发,有人用的是OpenLayers进行开发,有人用MapboxGL开发,有人用Cesium进行开发。看看吧,这些开发形式都是不同的,但是都属于WebGIS开发,都是使用接口进行开发,里边有封装好的类的属性和方法,只需要我们学会去调用做这些属性和方法就行了。
WebGIS框架
这些地图开发平台,其中Arcgis for JS api不是开源的地图开发平台,而OpenLayers,MapboxGL,Cesium都是开源的地图开发平台。关于二三维地图的开发,其中Cesium主要用于三维地图开发,它在这方面的功能是比较强大的,当然它也可以做二维地图的开发。而OpenLayers不支持三维地图的开发,它只支持二维地图的开发,MapboxGL和Arcgis for JS api 都是二维和三维都支持的,学习难度做对比起来的话,如果五颗星为满级,学习Arcgis for JS api可以说有4星级别的难度,学习MapboxGL和OpenLayers应该有3星级的难度吧,学习Cesium是比较简单的,网上有很多案例来供我们学习,学习起来两颗星难度级别吧,但是只要掌握其中的门道,学习起来都是相对快的,而这也只是我们了解到的冰山一角。总结一下,需要学习和掌握的程度:
了解主流WebGIS框架,包括Openlayers, Cesium, MapboxGL, Leaflet, ArcGIS API for js
尝试安装1-2种框架。
2、环境搭建
配置参考----通过 leaflet、cesium、mapBox 创建地图
六、扩展
1、QGIS----基于QT
2、了解Three.js
边栏推荐
猜你喜欢
Word文档中标题前面的黑点如何去掉
How is the entered query SQL statement executed?
Compréhension approfondie du symbole [langue C]
【公开课预告】:视频质量评价基础与实践
How to use concurrentlinkedqueue as a cache queue
Jerry's ad series MIDI function description [chapter]
Cloudcompare & open3d DBSCAN clustering (non plug-in)
从RepVgg到MobileOne,含mobileone的代码
WGCNA analysis basic tutorial summary
做BI开发,为什么一定要熟悉行业和企业业务?
随机推荐
Operation of adding material schedule in SolidWorks drawing
TCP shakes hands three times and waves four times. Do you really understand?
redis03——Redis的网络配置与心跳机制
Liu Jincheng won the 2022 China e-commerce industry innovation Figure Award
MP3是如何诞生的?
Jerry's ad series MIDI function description [chapter]
Flutter 返回按钮的监听
Jerry's ad series MIDI function description [chapter]
Numpy vstack and column_ stack
[public class preview]: basis and practice of video quality evaluation
Kubedm initialization error: [error cri]: container runtime is not running
Exclusive interview of open source summer | new committer Xie Qijun of Apache iotdb community
Analyzing the maker space contained in steam Education
Application practice | Shuhai supply chain construction of data center based on Apache Doris
Jerry added the process of turning off the touch module before turning it off [chapter]
如何借助自动化工具落地DevOps
[ 每周译Go ] 《How to Code in Go》系列文章上线了!!
【C语言】符号的深度理解
更强的 JsonPath 兼容性及性能测试之2022版(Snack3,Fastjson2,jayway.jsonpath)
gtest从一无所知到熟练运用(1)gtest安装