| 🍺Three.JS系列相关文章如下🍺: | |
|---|---|
| 1 | 【小沐杂货铺】基于Three.JS构建IFC模型浏览器(WebGL、CAD、Revit、IFC) |
| 2 | 【小沐杂货铺】基于Three.JS绘制汽车展示Car(WebGL、vue、react、autoshow)第1期 |
| 3 | 【小沐杂货铺】基于Three.JS绘制汽车展示Car(WebGL、vue、react、autoshow)第2期 |
文章目录
1、简介
1.1 球体构建
通过球面参数方程生成球面上的点,再用三角形网格拼成球体。为均匀化网格,采用细分大约二十面体方法,从低多边形球体开始细分,调整点位置使其位于球面上。
1.2 瓦片加载
将地球表面划分成瓦片,按摄像机位置和视角动态加载和卸载。采用球面瓦片索引,把球体划分为6个大瓦片,每个大瓦片细分,形成四叉树结构。根据摄像机到瓦片中心距离确定加载优先级,从服务器加载内容并映射到球体表面。
1.3 多级细节(LOD)
当用户拉近或拉远视角时,动态调整瓦片分辨率。预先生成多级分辨率瓦片,基于摄像机距离选择加载层级,应用平滑插值过渡,实现渐进式加载,消除弹跳闪烁问题。
1.4 坐标投影
将三维地球上的点投影到二维视图中。在低纬度区域使用墨卡托投影,高纬度区域采用球心投影,把三维坐标转换为经纬度后进行投影,再映射为二维屏幕坐标,解决极点附近变形问题。
5、代码测试
5.1 opengl / glfw / glew / curl / proj4 / gdal / stb_image / c++ (3d,瓦片贴图)
-
加载卫星影像图

-
加载行政地图

-
加载shp(shapefile)文件和显示:

-
绘制自定义的图形元素(线、面等)

-
切换地球底图的瓦片图源
5.2 opengl / glfw / glad / boost::asio / proj4 / stb_image / c++ (3d,瓦片贴图)

5.3 opengl / qt5 / c++ / 影像地图 (3d,瓦片贴图)
- 代码简介
绘制地球
绘制文字
加载和绘制XYZ瓦片影像地图
加载和绘制obj模型



结语
如果您觉得该方法或代码有一点点用处,可以给作者点个赞,或打赏杯咖啡;╮( ̄▽ ̄)╭
如果您感觉方法或代码不咋地//(ㄒoㄒ)//,就在评论处留言,作者继续改进;o_O???
如果您需要相关功能的代码定制化开发,可以留言私信作者;(✿◡‿◡)
感谢各位大佬童鞋们的支持!( ´ ▽´ )ノ ( ´ ▽´)っ!!!
如需源代码,请加文章末尾的QQ!

1956

被折叠的 条评论
为什么被折叠?



