cesium加载三维模型3dtiles

这篇具有很好参考价值的文章主要介绍了cesium加载三维模型3dtiles。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1.将数据和代码放到一个目录下

目的:为避免跨域

输入cmd命令
python3 -m http.server 5500

2.三维服务地址

http://127.0.0.1:5500/data/mars3d-max-shihua-3dtiles-master/tileset.json

3.模型网页地址

http://127.0.0.1:5500/cesium/cesium%E5%8A%A0%E8%BD%BD3dtile2.html文章来源地址https://www.toymoban.com/news/detail-646822.html

附录:源代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cesium 3D Tiles Example</title>
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.92/Build/Cesium/Cesium.js"></script>
    <link rel="stylesheet" href="https://cesium.com/downloads/cesiumjs/releases/1.92/Build/Cesium/Widgets/widgets.css"/>
    <script src="http://api.tianditu.gov.cn/cdn/plugins/cesium/cesiumTdt.js" ></script>
</head>
<body>
    <div id="cesiumContainer" style="width: 100%; height: 100vh;"></div>
    <script>
        Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3MzRiZWQyNS1kMzgxLTQzNGItYmFiNS0wZWQ5OGM0OWM3ZTYiLCJpZCI6MTU4MjYyLCJpYXQiOjE2OTEwNTQyMzV9.7d6zouTOikfatIQuU6CpNm41CTGaS0hp_tzo8tQdLPM";
        // 初始化Cesium Viewer
        var viewer = new Cesium.Viewer('cesiumContainer');
        //隐藏cesium的logo
        viewer._cesiumWidget._creditContainer.style.display = "none"; 
         

        // 加载3D Tiles数据
        var tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
            url: 'http://127.0.0.1:5500/data/mars3d-max-shihua-3dtiles-master/tileset.json'
        }));

        // 当3D Tiles数据加载完成后,定位到数据位置
        tileset.readyPromise.then(function() {
            // 获取3D Tiles数据的边界
            var boundingSphere = tileset.boundingSphere;

            // 定位到3D Tiles数据的位置
            viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0, -0.5, boundingSphere.radius));
            viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
        });
    </script>
</body>
</html>

4.可通过访问https://wkun.cc/查看示例。

到了这里,关于cesium加载三维模型3dtiles的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • cesium加载显示点云及倾斜模型(3dtiles)

            在cesium加载并显示点云或者倾斜模型之前,需要将不同格式的数据转为3dtiles,具体参考倾斜、点云转3dtiles(osgb、las转3dtiles)切片         转换完成后就可以写代码将其加载到cesium地球上。         有时候加载完成并不能贴地显示,或者贴地显示的具体位置和底

    2024年04月23日
    浏览(48)
  • Cesium.js加载3dTiles格式倾斜摄模型影悬浮空中的解决办法

    在之前的博文中,已经讲过如何在Cesium中加载3dTiles格式的倾斜摄影模型(Cesium加载3D Tiles模型)。最近发现一个问题,新加载的倾斜摄影模型,都漂浮在空中,无法很好的贴合地面。分析了一些这个问题,可能是由于以下原因造成的: 飞行器的精度 倾斜摄影的参数问题 Ces

    2024年02月12日
    浏览(58)
  • 前端使用Cesium加载三维模型全攻略

    想象一下,地球在你眼前旋转,上面还有各种3D模型,是不是很酷?Cesium是一个超酷的库,专门用来创建超炫的3D地球和地图。好,言归正传,今天这篇文章就分享一下前端如何使用Cesium加载三维模型。 首先,确保你已经安装了Cesium库。可以从Cesium官网下载最新版本的库文件

    2024年04月17日
    浏览(58)
  • 三维GIS开发:利用Cesium加载 M3D 地质体模型(附代码)

    实现步骤 Step 1.  引用开发库 : 本示例引用 local 本地【include-cesium-local.js】开发库,完成此步骤后才可调用三维 WebGL 的功能; Step 2.  创建布局 : 创建 id=\\\'GlobeView\\\' 的 div 作为三维视图的容器,并设置其样式; Step 3.  构造三维场景控件 : 实例化 Cesium.WebSceneControl 对象,完成

    2024年02月10日
    浏览(44)
  • vue中加载使用cesium加载3dTileset以及三维模型移动(1.108版本)

    加载三维模型 视频参考地址: https://www.bilibili.com/video/BV14g411s7DX/?spm_id_from=333.1007.top_right_bar_window_history.content.clickvd_source=4716b12357fe8e4b33b293b4bbbbfcd8

    2024年01月23日
    浏览(46)
  • Cesium入门之十:Cesium加载3DTiles数据

    3DTiles是一种面向网格化、可展示的大规模三维空间数据格式,专门为流式传输和渲染海量3D地理空间数据而设计的,用于存储和管理基于网格的三维模型数据。其数据结构基于B3DM和PNTS格式,可以支持多个级别的LOD,并使用Tilesets(瓦片集合)来组织和管理数据。3DTiles具有以

    2024年02月12日
    浏览(54)
  • cesium加载3dtiles倾斜摄影数据

    效果如图 倾斜摄影数据的地址:百度网盘 请输入提取码 提取码:ztde 1.配置nginx,代理3dtiles倾斜摄影数据服务 如我的倾斜摄影数据放在D盘的某个文件夹里面,nginx可以这样配置    2.代码里面3dtiles的url指向倾斜摄影服务地址,同时配置一系列的参数 3dtiles的配置参数如下,可

    2024年02月11日
    浏览(50)
  • Cesium 加载3Dtiles数据-最佳方法对比

            Cesium加载空间数据的方法有很多种,网络上关于3Dtiles数据集加载的废话连篇,看着就很无语。这里我本人直抒胸臆,简单介绍一下数据的加载方式。         先打开Cesium的深度检测的开关,也可以不打开。                完成以上步骤后,利用Cesium的readyPromi

    2024年02月11日
    浏览(97)
  • 前端VUE框架通过Cesium加载3dtiles,计算3dtiles的面积

    前端VUE框架通过Cesium加载3dtiles,计算3dtiles的面积完整代码 前端开发中,使用Vue框架可以帮助开发者更高效地开发复杂的Web应用程序,并且越来越多的项目开始集成三维地球数据可视化。Cesium是一个开源的JavaScript库,可以轻松地实现地球数据的可视化,同时支持3D场景的绘制

    2024年02月08日
    浏览(55)
  • Cesium加载城市白膜数据3DTiles

    首先,城市建筑数据可以去网上扒一些,拿到的都是 shp格式 的文件。 shp文件可以很方便的转为 Geojson文件 ,然后再通过Cesium导入也可以实现效果。效果如下所示: 图中就是用Geojson数据添加到地图中,大约有117000条数据,加载的效果还可以。但是数据量大加载时间会比较长

    2024年02月11日
    浏览(62)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包