zoukankan      html  css  js  c++  java
  • cesium【04-自定义图层选择器】

    自定义baseLayerPicker(图层选择器)

    设置自定义图层需要设置 imageryProviderViewModels属性,前提是baseLayerPicker =true(图层选择器)

    设置地形需要terrainProviderViewModels属性

    var viewer = new Cesium.Viewer('cesiumContainer',{
        //图层选择器
        baseLayerPicker:true,
        //获取或设置可用于图像选择的ProviderViewModel实例数组。
        imageryProviderViewModels:getImageryProviderArr(),
        //获取或设置可用于地形选择的ProviderViewModel实例数组。
        terrainProviderViewModels:getTerrainProviderViewModelsArr(),
    });
    
    //图层
    function getImageryProviderArr(){
        return [
            new Cesium.ProviderViewModel({
                //图层的名称。
                name:'图层一',
                //显示项目被隐藏的工具提示
                tooltip:'图层一',
                //代表图层的图标
                iconUrl:'img/1.jpg',
                //一个函数或命令,用于创建一个或多个提供程序,这些提供程序将在选择此项目时添加到地球仪中。
                creationFunction:function(){
                    return new Cesium.ArcGisMapServerImageryProvider({
                        url:'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
                    })
                }
            }),
            new Cesium.ProviderViewModel({
                //图层的名称
                name:'图层二',
                //显示项目被隐藏的工具提示
                tooltip:'图层二',
                //代表图层的图标
                iconUrl:'img/2.jpg',
                //一个函数或命令,用于创建一个或多个提供程序,这些提供程序将在选择此项目时添加到地球仪中
                creationFunction:function(){
                    return new Cesium.ArcGisMapServerImageryProvider({
                        url:'https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer',
                    })
                }
            })
        ]
    }
    
    //地形
    function getTerrainProviderViewModelsArr(){
        return[
            new Cesium.ProviderViewModel({
                //图层的名称
                name:'无地形',
                //显示项目被隐藏的工具提示
                tooltip:'WGS84标准球体',
                //代表图层的图标
                iconUrl:'img/3.jpg',
                //一个函数或命令,用于创建一个或多个提供程序,这些提供程序将在选择此项目时添加到地球仪中
                creationFunction:function(){
                    return new Cesium.EllipsoidTerrainProvider({
                        ellipsoid:Cesium.Ellipsoid.WGS84
                    })
                }
            }),
            new Cesium.ProviderViewModel({
                //图层的名称
                name:'地形',
                //显示项目被隐藏的工具提示
                tooltip:'STK在线地形',
                //代表图层的图标
                iconUrl:'img/4.jpg',
                //一个函数或命令,用于创建一个或多个提供程序,这些提供程序将在选择此项目时添加到地球仪中
                creationFunction:function(){
                    return new Cesium.CesiumTerrainProvider({
                        url:Cesium.IonResource.fromAssetId(1),
                        requestWaterMask:!0,
                        requestVertexNormals:!0
                    })
                }
            })
        ]
    }
  • 相关阅读:
    react结合antd4.0和umi3.0的404界面
    小程序自带组件自定义tabbar
    移动安全学习清单
    跨域资源共享 CORS 详解(转)
    docker常用命令总结
    XSS绕过小结
    mysql的order by注入
    本地文件包含漏洞利用姿势
    XSS绕过<>进行测试
    clamscan+clam-freshclam.service服务启停
  • 原文地址:https://www.cnblogs.com/MaShuai666/p/12727844.html
Copyright © 2011-2022 走看看