Question

使用产品：SuperMap iClient3D for WebGL 操作系统：win10 x64
数据类型： s3m倾斜摄影数据
问题详细描述：我这里有个设计界面，能否通过调整界面上的经纬度和旋转参数，动态改变s3m倾斜模型的位置。
问题重现步骤：1、通过viewer.scene.addS3MTilesLayerByScp()加载一个s3m倾斜模型 2、点击界面上经纬度，修改经纬度参数 3、三维场景内的s3m倾斜摄影模型位置随之改变。

界面如下：

Answer 1

您好，想要前端改变倾斜模型的位置，有以下几种方法可以实现：

1.可以使用实体的方式添加模型
viewer.entities.add({
      id: "test",
      position: Cesium.Cartesian3.fromDegrees(101.80089882736969, 26.60700234866561, 200),
      model: {
            uri: 'data/Cesium_Air.gltf'
             }
});

2.以实例化的方式添加模型
使用接口S3MInstanceCollection，在添加模型时，将界面填入的坐标位置和旋转参数传入，即可实现动态添加模型。
具体的参数说明可以参考我们相关博客：https://blog.csdn.net/supermapsupport/article/details/97913355

3.直接修改图层的坐标信息比如
layer.lat = 38.12115876850175; //纬度
layer.lon = 117.04856986486317; //经度
layer.height = 100;    //高度
layer.LoadingPriority = 2;    //设置加载的优先级模式为层优先加载模式
layer.refresh();

如果您倾斜数据不是单个s3m模型，比较大，用方法1和方法2可能添加不全，性能不是很理想，建议您那边使用方法3；如果是单个小模型，您可以选择上述三种方法的一种来进行修改模型坐标。

耿诗画

785EXP 2023年01月28日

我对您给出的答案研究了一下，还有点问题想请教下。我这边的服务是s3m的缓存地址，这样的服务地址不能添加嘛？地址：http://39.170.82.136:8090/iserver/services/3D-yzcdywngx/rest/realspace/datas/Config/config 。

17247603...

23EXP 2023年01月28日

修改S3MTilesLayer位置可以通过修改其属性来实现，参考以下代码：

注意需要设置加载模式为层优先加载模式。

你提供的服务地址是通过iserver 9D发布的，倾斜入库应该也是早期版本进行的，所以用这个更改位置有问题，使用新版iserver与iDesktop处理倾斜的话，是可以改的。

高光洋

1,427EXP 2023年01月30日

您好，我试了，还是有bug啊。

1、移动位置后，定位过去还是原来的位置，没有定位到调整后的位置。

2、移动后模型加载不稳定，有时能加载出来，有时不能，很随机。

重现bug：将以下代码复制到SuperMap iClient3D 11i (2023) beta for Cesium\examples\index.html，覆盖所有的代码后运行。点击按钮【东移0.01度】、按钮【东移1度】、【定位至模型】可以调试。界面如下：

代码见

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
  <meta name="viewport"
    content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
  <link href="../Build/Cesium/Widgets/widgets.css" rel="stylesheet" />
  <script src="./webgl/config.js"></script>
  <script type="text/javascript" src="../Build/Cesium/Cesium.js"></script>
  <script src="./webgl/js/config.js"></script>


  <style>
    html,
    body,
    #cesiumContainer {
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0;
      overflow: hidden;
    }
  </style>
</head>

<body>
  <div id="cesiumContainer"></div>
  <button id="btn" style="position: absolute; left: 10px; top: 5px">
    东移0.01度
  </button>
  <button id="btn1" style="position: absolute; left: 100px; top: 5px">
    东移1度
  </button>
  <button id="location" style="position: absolute; left: 180px; top: 5px">
    定位至模型
  </button>
  <button id="showmodel" style="position: absolute; left: 260px; top: 5px">
    显示隐藏
  </button>
  <script type="text/javascript">
    function onload(Cesium) {
      var viewer = new Cesium.Viewer('cesiumContainer', {
        infoBox: false, //是否显示信息框（InfoBox）
      })

      var labelImagery = new Cesium.TiandituImageryProvider({
        mapStyle: Cesium.TiandituMapsStyle.CIA_C, //天地图全球中文注记服务（经纬度投影）
        token: 'f3dd44f4f222f25c2fdeba995c43ab83',
      });
      viewer.imageryLayers.addImageryProvider(labelImagery);
      var scene = viewer.scene
      var s3mPromise = viewer.scene.addS3MTilesLayerByScp(
        'http://39.170.97.129:8090/iserver/services/3D-local3DCache-Config2/rest/realspace/datas/Combine/config',  //lat:44.93917176419239,lon:123.88419607891198

        {
          name: 'Combine',
          cullEnabled: false,
        }
      )

      Cesium.when(s3mPromise, (layer) => {
        viewer.flyTo(layer)
        console.log(layer, 'layer')

        // 东移0.01度
        var btn = document.querySelector('#btn')
        btn.addEventListener('click', function () {
          console.log('layer: ', layer);
          layer.lat = 44.93917176419239
          layer.lon = 123.89419607891198  // 东移0.01度
          layer.height = 100
          layer.LoadingPriority = 2
          layer.refresh()

          viewer.zoomTo(layer)
        })
        // 东移1度
        var btn1 = document.querySelector('#btn1')
        btn1.addEventListener('click', function () {
          layer.lat = 44.9388306985484
          layer.lon = 124.89419607891198 // 东移1度
          layer.height = 100
          layer.LoadingPriority = 2
          layer.refresh()

          viewer.zoomTo(layer)
        })

        // 定位至模型
        var location = document.querySelector('#location')
        location.addEventListener('click', function () {
          viewer.zoomTo(layer)
        })

        // 显示隐藏模型        
        var showmodel = document.querySelector('#showmodel')
        showmodel.addEventListener('click', function () {
          layer.visible=!layer.visible
        })
      })
    }




    if (typeof Cesium !== 'undefined') {
      window.startupCalled = true
      onload(Cesium)
    }
  </script>
</body>

</html>

17247603...

23EXP 2023年06月02日

请登录或者注册后回答这个问题。

1个回答

请登录或者注册后再添加评论。

请 登录 或者 注册 后回答这个问题。

1个回答

请 登录 或者 注册 后再添加评论。

智能推荐

请登录或者注册后回答这个问题。

请登录或者注册后再添加评论。