ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

cesium教程3-加载3dtile模型,并调整位置

2022-08-15 22:30:21  阅读:164  来源: 互联网

标签:tileset 3dtile viewer transform var Cesium cesium height 加载


 

 直接上示例代码:

<!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 onl oad="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>

 

标签:tileset,3dtile,viewer,transform,var,Cesium,cesium,height,加载
来源: https://www.cnblogs.com/tiandi/p/16589892.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有