mars3d for cesium 小记(1)

942 阅读1分钟

对bim进行裁剪

let clipTileset = new mars3d.thing.TilesetPlanClip({
    layer: bimLayer,
    type: mars3d.thing.TilesetPlanClip.Type.ZR, // 裁剪方向
    distance: 100, // 裁剪长度
    tileset: bimLayer.layer, // 裁剪的对象
    clipOutSide: false,
    edgeColor: this.Cesium.Color.GREY,
    edgeWidth: 2.0
})
// 初始化map
let map = new mars3d.Map(`dom`, mapOptions)      
map.addThing(clipTileset)

// 操作事件之后 重新摄像distance 即可
clipTileset.distance = '50'

对3dtiles模型设置点击高亮

方法一

初始化3dtiles模型时设置 showClickFeature = true

此方法缺点在于,当模型本身切片不完整时,点击可能只有一部分会高亮

bimLayer = new this.mars3d.layer.TilesetLayer({
    url: 'xxx.json',
    showClickFeature: true, // 是否点击高亮 
    // 设置高亮颜色
    pickFeatureStyle: {
      color: '#00FF00'
    }
})

方法二

监听点击事件,重新设置颜色

根据被点击的构件的id匹配到所有id相同的构件,并重新设置颜色,可弥补方法一的缺点

因模型本身切片不完整时,可能会导致同一个构件被切开成多个切片,但其构件id是相同的

// bimLayer 被加载的3dtiles模型
bimLayer.on(this.mars3d.EventType.click, event => {
    const id = event.graphic.attr.id
    bimLayer.tileset.style = new this.Cesium.Cesium3DTileStyle({
      color: {
        conditions: [
          ["${id} ==='" + id + "'", 'rgba(0,255,0,1)'],
          ['true', 'rgb(255, 255, 255)']
        ]
      }
    })
})

方法二设定颜色 运用3dtiles样式语言( 3D Tiles Styling language Github)

结束,以上使用mars3d 3+ 版本,部分使用方式与低版本不同