Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

1年前作者：虚拟现实（微尘）分类：Toy博客阅读(86)违法举报

这篇具有很好参考价值的文章主要介绍了Three.js开发神器-结合3DTiles插件加载倾斜摄影模型。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

首先我们通过链接和图片来看看效果

演示Demo链接地址：https://n3gis.github.io/exportToThree(3.0).html?scene=Demo_4

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

使用到的软件（软件大家到Unity商城上搜索，Unity商城地址：https://assetstore.unity.com）

Unity3D

3DTiles（Unity3D插件，用于加载OSGB格式的倾斜摄影数据）

Export To Three.js（Unity3D插件，将Unity3D的三维场景导出到Three.js中来渲染）

首先我们使用3DTiles插件将OSGB数据转换成3DTiles格式，在Unity3D软件菜单中，选择Window/3DTiles/ConvertTo3DTiles

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

在弹出的窗口中，选择OSGB文件目录及转换后保持的文件目录，注意文件目录不要有中文路径

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

点击Convet按钮后，等待模型的转换完成，模型转换完成后，使用Single Tileset Load脚本在Unity编辑器中加载倾斜摄影模型，如下图所示

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

接下来我们使用Export To Three.js（3.0）来导出倾斜摄影模型，在Unity3d菜单中，选择File/Export/Export To Three.js

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

在弹出的窗口中，我们选择如下配置，其它配置项使用默认值来导出倾斜摄影模型

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

选择需要导出的相机及倾斜摄影模型，点击Export即可，导出后，可以在Setting中查看导出的文件目录，使用Export To Three.js（3.0）插件默认的js案例工程即可加载倾斜摄影数据；

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

如下是使用Three.js加载的倾斜摄影效果

Three.js开发神器-结合3DTiles插件加载倾斜摄影模型

ok，本节就讲到这里了，如果文章有看不懂的，可以观看如下视频教程

https://youtu.be/mTd1B5soc20文章来源地址https://www.toymoban.com/news/detail-419268.html

到了这里，关于Three.js开发神器-结合3DTiles插件加载倾斜摄影模型的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

ThreeJS-加载3dtiles数据
目前加载3dtiles数据的方式有三种，均是借助第三方插件的方式 3d-tiles-renderer https://github.com/NASA-AMMOS/3DTilesRendererJS
2024年02月11日
浏览(19)
cesium加载三维模型3dtiles
目的：为避免跨域输入cmd命令 python3 -m http.server 5500 http://127.0.0.1:5500/data/mars3d-max-shihua-3dtiles-master/tileset.json http://127.0.0.1:5500/cesium/cesium%E5%8A%A0%E8%BD%BD3dtile2.html
2024年02月13日
浏览(174)
Threejs模型切片转3DTiles加载
个人主页：左本Web3D，更多案例预览请点击==》在线案例个人简介：专注Web3D使用ThreeJS实现3D效果技巧和学习案例 💕 💕积跬步以至千里，致敬每个爱学习的你。获取模型或源码请点赞收藏加留言，有问题请私信或加微信 1，模型切片，如下图选择“通用模型切片”模块
2024年02月11日
浏览(13)
vue+cusium加载3dtiles模型
结合cesium,有很多种方法，这里举例最简单的，小白入门首选添加完，就可以正常运行了正常打包完，直接打开index是不会加载的，有的还会报错，这是跨域所致，要配置服务器具体步骤一、打开dist文件，输入cmd 二、配置服务器npm install http-server -g 三、添加请求头http-serv
2024年02月05日
浏览(9)
threejs加载3dtiles（倾斜摄影）数据
使用npm 安装或者去官网下载都行 GitHub - NASA-AMMOS/3DTilesRendererJS: Renderer for 3D Tiles in Javascript using three.js 首先引入，在填入3dtiles数据的地址，可以是文件路径也可以是网站路径 const tilesRenderer = new TilesRenderer( \\\'./path/to/tileset.json\\\' ); const tilesRenderer = new TilesRenderer( \\\'http://192.168.1.
2024年02月16日
浏览(14)
Cesium地图上加载3DTiles模型
1，使用Blender创建模型：官网下载Blender：https://www.blender.org/，在Github上下载Building Tools插件，通过编辑-偏好设置-插件-安装，导入压缩包使用，这个可以自己创建小房子，文件-导出为obj格式 2，将.obj转成3dtiles格式： 1，第一种方法通过加载本地文件展示： 1，github下载ObjTo3
2024年02月03日
浏览(40)
cesium加载3dtiles倾斜摄影数据
效果如图倾斜摄影数据的地址：百度网盘请输入提取码提取码：ztde 1.配置nginx，代理3dtiles倾斜摄影数据服务如我的倾斜摄影数据放在D盘的某个文件夹里面，nginx可以这样配置 2.代码里面3dtiles的url指向倾斜摄影服务地址，同时配置一系列的参数 3dtiles的配置参数如下，可
2024年02月11日
浏览(44)
Cesium 加载3Dtiles数据-最佳方法对比
Cesium加载空间数据的方法有很多种，网络上关于3Dtiles数据集加载的废话连篇，看着就很无语。这里我本人直抒胸臆，简单介绍一下数据的加载方式。先打开Cesium的深度检测的开关，也可以不打开。完成以上步骤后，利用Cesium的readyPromi
2024年02月11日
浏览(44)
Cesium加载3Dtiles模型-大疆智图
Cesium加载3Dtiles模型步骤：（一）如果您使用的是大疆智图，则该软件可以直接输出3Dtiles格式（B3DM切片）的数据，如图所示：（二）如果您使用的是CC（Smart3D），该软件可以输出OSGB格式的数据，我们可以借助： 1.osg2cesiumApp v1.3软件来将我们的OSGB倾斜摄影数据转换成3Dtil
2024年02月11日
浏览(54)
Cesium加载城市白膜数据3DTiles
首先，城市建筑数据可以去网上扒一些，拿到的都是 shp格式的文件。 shp文件可以很方便的转为 Geojson文件，然后再通过Cesium导入也可以实现效果。效果如下所示：图中就是用Geojson数据添加到地图中，大约有117000条数据，加载的效果还可以。但是数据量大加载时间会比较长
2024年02月11日
浏览(42)