当前位置:首页 » 《关注互联网》 » 正文

【WebGIS实例】(14)MapboxGL 加载地形高程数据

15 人参与  2024年09月21日 19:20  分类 : 《关注互联网》  评论

点击全文阅读


前言

官网示例:Add 3D terrain to a map | Mapbox GL JS | Mapbox
大佬博客:Mapbox GL基础(七):地形数据的处理与加载 (jl1mall.com)

加载Mapbox地形数据

map.once('style.load', () => {  map.addSource('mapbox-dem', {    type: 'raster-dem',    url: 'mapbox://mapbox.mapbox-terrain-dem-v1',    tileSize: 512,    maxzoom: 14  })  map.setFog({}) // 可选:添加大气层(雾气)效果  map.setTerrain({ source: 'mapbox-dem', exaggeration: 1.5 })})

在这里插入图片描述

加载 tif 格式高程影像

数据名称:Rectangle_#5_高程_右3_Level_16.tif
使用工具:GitHub - FreeGIS/dem2terrain: 根据dem数据生成地形切片的工具
NodeJS 版本:v16.20.2

dem2terrain 这个库的教程写得非常详细了,把项目拷下来按着教程配置一遍就行了。下面是我遇到的问题的记录:

NodeJS 版本问题:实测16.20.2是可行的Windows11 c++编译环境问题
报错npm ERR! gyp ERR! stack Error: Could not find any Visual Studio installation to use
解决方案
参考 GitHub - nodejs/node-gyp: Node.js native addon build tool
安装包管理工具:Chocolatey,然后在终端执行:choco install python visualstudio2022-workload-vctools -y
map.once('style.load', () => {  map.addSource('mapbox-dem', {    type: 'raster-dem',    tiles: ['/terrain/{z}/{x}/{y}.png'], //自己的地址    tileSize: 512,    maxzoom: 14  })  map.setFog({}) // 可选:添加大气层(雾气)效果  map.setTerrain({ source: 'mapbox-dem', exaggeration: 1.5 })})

点击全文阅读


本文链接:http://zhangshiyu.com/post/162906.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

关于我们 | 我要投稿 | 免责申明

Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1