直接上示例代码：

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>cesium示例</title>

  <!-- 引用cesium的js和css，天地图的扩展js -->

  <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>

  <style type="text/css">

    html, body, #tiandituContainer {

      width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;

    }

  </style>

</head>

<body onload="loadData()">

<div id="tiandituContainer">

</div>

<script>

  //Cesium官网注册后的授权token，没有token不能使用cesium在线的地形服务，这里需要改成自己的token

  Cesium.Ion.defaultAccessToken = "";

  var viewer;

   function loadData()

   {

       //默认会调用微软virtualearth地图

        viewer = new Cesium.Viewer('tiandituContainer',{

          animation:false,       //是否显示动画控件

          homeButton:true,       //是否显示home键

          geocoder:true,         //是否显示地名查找控件，如果设置为true，则无法查询

          baseLayerPicker:true, //是否显示图层选择控件

          timeline:false,        //是否显示时间线控件

          fullscreenButton:true, //是否全屏显示

          infoBox:true,         //是否显示点击要素之后显示的信息

          sceneModePicker:true,  //是否显示投影方式控件  三维/二维

          navigationInstructionsInitiallyVisible:false, //导航指令

          navigationHelpButton:false,     //是否显示帮助信息控件

          selectionIndicator:false, //是否显示指示器组件

        });

        //隐藏cesium的logo

        viewer._cesiumWidget._creditContainer.style.display = "none";

        //默认的Cesium会加载一个bingMap底图，这个地图网络不太好，一般要先去掉这个默认的

        viewer.imageryLayers.remove(viewer.imageryLayers.get(0));

        //arcgis在线影像地图

        viewer.imageryLayers.addImageryProvider(new Cesium.ArcGisMapServerImageryProvider({

            name:"img_arcgis",

            url:"https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"

        }));

         viewer.scene.globe.depthTestAgainstTerrain = true;//地形遮挡效果开关，打开后地形会遮挡看不到的区域

         viewer.scene.globe.enableLighting = true; //对大气和雾启用动态照明效果

       add3DTiles("https://data.mars3d.cn/3dtiles/max-fsdzm/tileset.json",121.479394, 29.791416,8);

   }

           function add3DTiles(url,longitude, latitude, height) {

                var tileset = viewer.scene.primitives.add(

                            new Cesium.Cesium3DTileset({

                                url:url,

                                maximumScreenSpaceError: 2,//默认16,最大屏幕空间错误

                                //maximumNumberOfLoadedTiles: 1000,

                                maximumMemoryUsage:512//默认512,内存MB的最大数量

                            }));

                tileset.readyPromise.then((tileset) => {

                            //模型加载后可能会有便宜和高度不对，需要对模型进行调整

                            tileSet(tileset,longitude, latitude, height)

                            //tileSetAll(tileset,longitude, latitude, height,0,0,0,1);

                    viewer.zoomTo(tileset);

                });

            }

            //利用translation对模型的经度、纬度、高度进行修改

               function tileSet(tileset,longitude, latitude, height)

               {

                   //3dtile模型的边界球体

                   var boundingSphere = tileset.boundingSphere;

                   //迪卡尔空间直角坐标=>地理坐标（弧度制）

                   var cartographic_original = Cesium.Cartographic.fromCartesian(boundingSphere.center);

                   //设置新的经度、纬度、高度

                   var cartographic_offset  = Cesium.Cartographic.fromDegrees(longitude, latitude, height)

                   //地理坐标（弧度制）=>迪卡尔空间直角坐标

                   var Cartesian3_original = Cesium.Cartesian3.fromRadians(cartographic_original.longitude, cartographic_original.latitude, cartographic_original.height);

                   var Cartesian3_offset  = Cesium.Cartesian3.fromRadians(cartographic_offset.longitude, cartographic_offset.latitude, cartographic_offset.height);

                   //获得地面和offset的转换

                   var translation = Cesium.Cartesian3.subtract(Cartesian3_offset, Cartesian3_original, new Cesium.Cartesian3());

                   //修改模型矩阵

                   tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);

               }

            //利用transform对模型的所有参数进行修改

               function tileSetAll(tileset,longitude,latitude,height,rotateX,rotateY,rotateZ,scale)

               {

                     //旋转角度设置

                     var mx = Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(rotateX));

                     var my = Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(rotateY));

                     var mz = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(rotateZ));

                     var rotationX = Cesium.Matrix4.fromRotationTranslation(mx);

                     var rotationY = Cesium.Matrix4.fromRotationTranslation(my);

                     var rotationZ = Cesium.Matrix4.fromRotationTranslation(mz);

                     //平移 修改经纬度

                     var position = Cesium.Cartesian3.fromDegrees(longitude,latitude,height);

                     var transform = Cesium.Transforms.eastNorthUpToFixedFrame(position);

                     //旋转、平移矩阵相乘

                     Cesium.Matrix4.multiply(transform, rotationX, transform);

                     Cesium.Matrix4.multiply(transform, rotationY, transform);

                     Cesium.Matrix4.multiply(transform, rotationZ, transform);

                     //缩放 修改缩放比例

                     var scale1 = Cesium.Matrix4.fromUniformScale(scale);

                     Cesium.Matrix4.multiply(transform, scale1, transform);

                     //赋值给tileset

                     tileset._root.transform = transform;

               }

</script>

</body>

</html>

三维模型有的没有坐标信息，可以在转换的时候添加坐标信息，具体如下：

cesium教程3-加载3dtile模型，并调整位置的更多相关文章

  1. cesium 学习(五) 加载场景模型

    cesium 学习(五) 加载场景模型 一.前言 现在开始实际的看看效果,目前我所接触到基本上都是使用Cesium加载模型这个内容,以及在模型上进行操作.So,现在进行一些加载模型的学习,数据的话可以 ...

  2. [译]Vulkan教程(31)加载模型

    [译]Vulkan教程(31)加载模型 Loading models 加载模型 Introduction 入门 Your program is now ready to render textured ...

  3. cesium加载gltf模型

    cesium加载gltf模型 一.采用vue-cesium:在项目里加载依赖包.命令如下: npm i --save vue-cesium 在main.js中加入如下代码: https://www.n ...

  4. cesium加载gltf模型点击以及列表点击定位弹窗

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 之 ...

  5. ceisum_加载倾斜摄影模型

    osgb转换为3Dtiles格式(使用工具转换) 然后加载到cesium中(加载代码见下,可以控制模型高度) var offset = function(height,tileset) { conso ...

  6. WebGL three.js学习笔记 加载外部模型以及Tween.js动画

    WebGL three.js学习笔记 加载外部模型以及Tween.js动画 本文的程序实现了加载外部stl格式的模型,以及学习了如何把加载的模型变为一个粒子系统,并使用Tween.js对该粒子系统进行 ...

  7. cesium初探之加载三维模型

    项目需要用到二三维地图切换,本来准备研究ArcGIS js for Web 3d,但考虑到版权的问题,决定试着用cesium来做,于是花了2天时间抱着试试看的心态把cesium从环境配置到加载三维模型 ...

  8. Cesium for Unreal加载倾斜摄影

    本文介绍UE4中通过Cesium插架加载本地倾斜摄影模型.Cesium for Unreal插件运行在UE环境何总运行Cesium,这样方便做一个GIS应用. 安装Cesium for Unreal插 ...

  9. 6_1 持久化模型与再次加载_探讨(1)_三种持久化模型加载方式以及import_meta_graph方式加载持久化模型会存在的变量管理命名混淆的问题

    笔者提交到gitHub上的问题描述地址是:https://github.com/tensorflow/tensorflow/issues/20140 三种持久化模型加载方式的一个小结论 加载持久化模型 ...

  10. xBIM 实战02 在浏览器中加载IFC模型文件并设置特效

    系列目录    [已更新最新开发文章,点击查看详细]  在模型浏览器中加载模型后,可以对模型做一些特殊操作.下图是常用的设置. 都是通过 xbim-viewer.js 中的 API 来设置以达到一定的 ...

随机推荐

  1. Python爬取腾讯疫情实时数据并存储到mysql数据库

    思路: 在腾讯疫情数据网站F12解析网站结构,使用Python爬取当日疫情数据和历史疫情数据,分别存储到details和history两个mysql表. ①此方法用于爬取每日详细疫情数据 1 impo ...

  2. C#第一个helloworld程序

    1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Text; 5 usin ...

  3. 解决 `remote: You must use a personal access token with 'api' scope for Git over HTTP.`

    背景 在家远程办公的时候 git clone 报错: remote: HTTP Basic: Access denied remote: You must use a personal access ...

  4. 基于新版宝塔Docker部署在线客服系统过程小记

    我在业余时间开发维护了一款免费开源的升讯威在线客服系统,也收获了许多用户.对我来说,只要能获得用户的认可,就是我最大的动力. 客服系统开发过程中,最让我意外的是对 TCP/IP 协议的认识.过去一直认 ...

  5. 【Kotlin】List、Set、Map简介

    1 List ​ Java 的 List.Set.Map 介绍见 → Java容器及其常用方法汇总. 1.1 创建 List 1.1.1 emptyList var list = emptyList& ...

  6. MogDB/openGauss数据库package关键字的两种用法

    MogDB/openGauss 数据库 package 关键字的两种用法 本文出处:https://www.modb.pro/db/237701 package 关键字在 MogDB 数据库里有两种用 ...

  7. sql 语句系列(记录时间差)[八百章之第十八章]

    计算当前记录和下一条记录之间的日期差 关键点在于如何获得下一条日期. mysql 和 sql server select x.*,DATEDIFF(day,x.HIREDATE,x.next_hd) ...

  8. opensips开启python支持

    操作系统 :CentOS 7.6_x64   opensips版本: 2.4.9   python版本:2.7.5 python作为脚本语言,使用起来很方便,查了下opensips的文档,支持使用py ...

  9. 阿里云数字化安全生产平台 DPS V1.0 正式发布！

    ​简介:数字化安全生产平台则帮助客户促进业务与 IT 的全面协同,从业务集中监控.业务流程管理.应急指挥响应等多维度来帮助客户建立完善专业的业务连续性保障体系. 作者:银桑.比扬 阿里云创立于 200 ...

  10. 大数据时代下，App数据隐私安全你真的了解么？

    ​简介:你是否有过这样的经历:你和朋友聊天表达你近期想要购买某件商品,第二天当你打开某购物软件时,平台向你推送的商品正是你想要购买的:或者,你是否接到过陌生来电,他们准确的报出了你的名字和年龄.... ...