在cesuim上展示二维模型

最新推荐文章于 2024-02-29 08:57:23 发布

-小C_

最新推荐文章于 2024-02-29 08:57:23 发布

阅读量335

点赞数

分类专栏： Cesium 文章标签：前端

本文链接：https://blog.csdn.net/m0_75107188/article/details/132458542

版权

Cesium 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

前提问题：在cesuim上展示二维模型

解决过程：

1.获取或定义所需变量

2.通过window.cesium.viewer.imageryLayers.addImageryProvider和new Cesium.UrlTemplateImageryProvider进行建模

3.传入url路径后拼接+{z}/{x}/{y}.png

4.聚焦到此模型window.cesium.viewer.camera.flyTo

//此值根据实际情况进行获取或定义
let metaContent = ...
let twoModelInfo ={
    url: url,
    areas: [
         {
             west: metaContent.west,
             south: metaContent.south,
             east: metaContent.east,
             north: metaContent.north,
             // 瓦片等级
             minimumLevel: 10,
             maximumLevel: 23
         }
     ]
}
create2DModel(twoModelInfo,isFocus)

//创建二维正射影像
export const create2DModel= (twoModelInfo,isFocus) => {
    if (twoModelInfo && twoModelInfo?.areas?.length > 0 ) {
        let tilesUrl = twoModelInfo.url
        twoModelInfo.areas.forEach(item => {
            window.cesium.viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
              url: tilesUrl  + "{z}/{x}/{y}.png",
              minimumLevel: item.minimumLevel,
              maximumLevel: item.maximumLevel,
              rectangle: new Cesium.Rectangle.fromDegrees(item.west, item.south, item.east, item.north)
            }))
            //判断是否需要在建模后聚焦到此模型
            if(isFocus){
                window.cesium.viewer.camera.flyTo({
                    destination : new Cesium.Rectangle.fromDegrees(item.west, item.south, item.east, item.north)
                });
            }
        })
    }
}