cesium模型定位到tile

花归去

于 2024-07-23 13:56:29 发布

阅读量257

点赞数 7

分类专栏： cesium vue 文章标签：前端 javascript cesium

本文链接：https://blog.csdn.net/weixin_42120669/article/details/140633557

版权

vue 同时被 2 个专栏收录

33 篇文章 0 订阅

订阅专栏

cesium

15 篇文章 0 订阅

订阅专栏

定位到符合条件的tile

模型数据自行处理

  Cesium.Resource.fetchJson({
    url: '../../public/模型/scenetree.json'
  }).then(res => {
    let data = res.scenes[0].children.length
    for (let i = 0; i < data; i++) {
      if (i == 0) {
        res.scenes[0].children[i].children[0].children.forEach(item => {
          dataList.data.push({
            id: item.id,
            name: item.name,
            sphere: item.sphere,
          })
        })
      } else if (i == 1) {
        res.scenes[0].children[i].children.forEach(item => {
          dataList.data.push({
            id: item.id,
            name: item.name,
            sphere: item.sphere,
          })
        })
      }
    }
  })

然后根据名称或者id 遍历数据，操作相机

   dataList.data.forEach(item => {
    if (item.id == val.id) {
      let sphere = item.sphere
      let center = new Cesium.Cartesian3(sphere[0], sphere[1], sphere[2])
      const boundingSphere = new Cesium.BoundingSphere(center, sphere[3])
      viewer.camera.flyToBoundingSphere(boundingSphere, {
        offset: new Cesium.HeadingPitchRange(3.5, -0.5, 200),
        duration: 2,
      })
    }
  })

修改制定tile的颜色

 con = [
            ['${name} ==="227" ', 'color("blue", 0.5)'], //符合条件项
            ['true', 'rgba(255,255,255,0.3)'] //其他项
        ]
        tileset.style = new Cesium.Cesium3DTileStyle({
            color:{
                conditions:con
            }
        })