cesium加载glb格式的3d模型

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

官方示例:Cesium Sandcastlehttps://sandcastle.cesium.com/?src=3D%20Models.html&label=Tutorials

glb模型下载:https://sandcastle.cesium.com/SampleData/models/CesiumAir/Cesium_Air.glb 

 cesium加载glb格式的3d模型

cesium加载glb格式的3d模型文章来源地址https://www.toymoban.com/news/detail-507797.html

<template>
  <div style="height: 100vh">
    <div id="cesiumContainer" />
  </div>
</template>

<script>
export default {
  name: "test",
  data() {
    return {};
  },
  mounted() {
    const viewer = new Cesium.Viewer("cesiumContainer", {
      infoBox: false,
      selectionIndicator: false, //关闭选择指示器
      shadows: true,
      shouldAnimate: true, //模型显示动画
    });
    viewer.entities.removeAll();

    const position = Cesium.Cartesian3.fromDegrees(
      -123.0744619,
      44.0503706,
      5000.0
    );
    const heading = Cesium.Math.toRadians(135);
    const pitch = 0;
    const roll = 0;
    const hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
    const orientation = Cesium.Transforms.headingPitchRollQuaternion(
      position,
      hpr
    );

    const entity = viewer.entities.add({
      name: "Cesium_Air",
      position: position,
      orientation: orientation,
      model: {
        uri: "Cesium_Air.glb",
        minimumPixelSize: 128,
        maximumScale: 20000,
      },
    });
    viewer.trackedEntity = entity;
  },
};
</script>

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

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

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

相关文章

  • Cesium三维数据格式以及生产流程详解(glb,osgb,obj,bim,ifc)等

    最近收到私信问我在cesium上展示的一些三维数据是如何生产和处理的,这篇文章就给大家一次性讲个透彻。 首先我们来做做分类。市面上能接触到的,常见的,cesium上支持展示的三维数据大致分为以下几种: 1.倾斜摄影(osgb,obj) 2.点云数据(las,pts) 3.手工模型(gltf,

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

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

    2024年02月10日
    浏览(28)
  • Cesium 实战 - 使用 gltf-vscode 查看、预览以及编辑 glTF 和 GLB 模型

    模型渲染作为 Cesium 一个非常重要的功能,目前 只支持 glTF 和 GLB 两种格式,其实是一种格式 ,GLB 是 glTF 的二进制形式。 在实际项目中,由于对模型的操作,可能会需要查看模型的属性。之前一直使用 blender 来查看、调整以及转换等操作。模型转换详见:Cesium 三维模型使用

    2024年02月11日
    浏览(79)
  • Cesium加载3D Tiles数据

    使用原生Cesium加载3D Tiles数据,并实现对图层的选中、样式的修改、图元的隐藏。 实现代码 实现效果

    2023年04月22日
    浏览(31)
  • 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日
    浏览(32)
  • 【Cesium】vue项目加载3DTileset(.b3dm 格式)

    安装vue-cli-plugin-cesium 专门为脚手架vue-cli3.0和2.0打造的针对Cesium的VueCli扩展插件,自动化包括:         1.自动扩展 VueCLI 中 Cesium 相关的 webpack 配置        2. 添加一个 cesium 别名,以便我们在项目中轻松的引入 Cesium 文件资源         使 Cesium 对象实例可在每个 Vue 模块中

    2024年02月04日
    浏览(24)
  • Cesium地图上加载3DTiles模型

    1,使用Blender创建模型: 官网下载Blender:https://www.blender.org/,在Github上下载Building Tools插件,通过编辑-偏好设置-插件-安装,导入压缩包使用,这个可以自己创建小房子,文件-导出为obj格式 2,将.obj转成3dtiles格式: 1,第一种方法通过加载本地文件展示: 1,github下载ObjTo3

    2024年02月03日
    浏览(29)
  • vue结合Cesium加载gltf模型

    Cesium支持什么格式?         Cesium支持的格式包括:3D模型格式(如COLLADA、gITF、OBJ)、影像格式(如JPEG、PNG、GeoTIFF)、地形格式(如STL、Heightmap)、矢量数据格式(如GeoJSON、KMZ)、时间动态数据格式(如CZML),以及其他各种数据格式。此外,Cesium还通过插件支持其他特

    2024年02月01日
    浏览(28)
  • Cesium加载3Dtiles模型-大疆智图

    Cesium加载3Dtiles模型步骤: (一)如果您使用的是大疆智图,则该软件可以直接输出3Dtiles格式(B3DM切片)的数据,如图所示:   (二)如果您使用的是CC(Smart3D),该软件可以输出OSGB格式的数据,我们可以借助: 1.osg2cesiumApp v1.3软件来将我们的OSGB倾斜摄影数据转换成3Dtil

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

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

    2024年04月17日
    浏览(29)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包