GIS开发:mapbox中简单模型

简介: GIS开发:mapbox中简单模型

mapbox中能像高德地图或者百度地图,在放大到一定程度,显示一些简单模型,并且可以贴一些贴图,达到一个平面的立体三维效果。
在mapbox的示例中,展示了如何加载一些立体模型的效果,这个数据是用的mapbox上的在线切片数据。
https://docs.mapbox.com/mapbox-gl-js/example/3d-buildings/

通过在网上下载建筑物轮廓的数据,也能够实现加载这种模型的效果,一种方式时,将数据转换成geojson的格式,直接进行加载,这种的缺点是在数据量很大的时候,系统性能消耗也很大,另一种就是切片成vector tile进行加载,就像地图切片一样,按照缩放的范围进行加载;这种立体建筑物的效果,需要在数据中,有一个高度的字段,或者也可以设置成一个统一的高度。
代码是加载图层的方法,关键是设置'type': 'fill-extrusion', 'fill-extrusion-height': [ 和 'fill-extrusion-base' 三个属性,通过base和height的设置,也能够达到一种悬浮在空中的效果,具体的实现方法参见官方样例。
image.png
不过,按照目前类库的实现,建筑的边线并不能设置,所以并不能显示出一种边框式的效果。

相关文章
|
前端开发 搜索推荐 定位技术
GIS前端—地图标注
GIS前端—地图标注
221 1
|
3月前
|
数据可视化 大数据 定位技术
GIS:开源webgl大数据地图类库整理
GIS:开源webgl大数据地图类库整理
|
关系型数据库 定位技术 数据库
|
4月前
|
数据采集 消息中间件 数据可视化
无代码玩转GIS应用,我也在行
无代码玩转GIS应用,我也在行
35 0
|
前端开发 JavaScript 定位技术
提升前端GIS开发技能:深入了解5个热门地图框架
提升前端GIS开发技能:深入了解5个热门地图框架
856 0
|
定位技术
GIS开发:blender调整模型信息
GIS开发:blender调整模型信息
146 0
|
JavaScript 定位技术 API
GIS开发:three.js标签注记添加
GIS开发:three.js标签注记添加
378 0
|
JavaScript 数据可视化 前端开发
《面向三维GIS的Cesium开发与应用》读书笔记
《面向三维GIS的Cesium开发与应用》读书笔记
|
JavaScript 前端开发 大数据
GIS开发:推荐Mapbox gl解决方案
GIS开发:推荐Mapbox gl解决方案
323 0
|
定位技术
图源超丰富的GIS在线地图小插件
这次给大家提供一个超级棒的arcgis加载在线地图的插件SimpleGIS
599 0