首页 > 其他分享 >cesium实现3D区域掩膜的效果

cesium实现3D区域掩膜的效果

时间:2023-11-03 17:56:10浏览次数:94  
标签:addRect 掩膜 135.0 instances 90.0 Cesium cesium new 3D

先展示效果:

上代码:

 add3DAreA(geojson) {
        let arr = []
        geojson.features[0].geometry.coordinates[0][0].forEach(item => {
            arr.push(item[0])
            arr.push(item[1])
        });
        var maskspoint = Cesium.Cartesian3.fromDegreesArray(arr);
        var polygonWithHole = new Cesium.PolygonGeometry({
            polygonHierarchy: new Cesium.PolygonHierarchy(
                Cesium.Cartesian3.fromDegreesArray([73.0, 53.0, 73.0, 0.0, 135.0, 0.0, 135.0, 53.0]),
                [new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(arr))]
            )
        });

        var geometry = Cesium.PolygonGeometry.createGeometry(polygonWithHole);
        let instances = [];
        instances.push(new Cesium.GeometryInstance({
            geometry: geometry,
            attributes: {
                color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString("#1e2426"))
            }
        }));
        function addRect(instances, left, down, right, up) {
            instances.push(new Cesium.GeometryInstance({
                geometry: new Cesium.RectangleGeometry({
                    rectangle: Cesium.Rectangle.fromDegrees(left, down, right, up)
                }),
                attributes: {
                    color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString("#1e2426"))
                }
            }));
        }
        addRect(instances, -180.0, -90.0, 73.0, 90.0);
        addRect(instances, 135.0, -90.0, 180.0, 90.0);
        addRect(instances, 73.0, 53.0, 135.0, 90.0);
        addRect(instances, 73.0, -90.0, 135.0, 0.0);
        this.viewer.scene.primitives.add(new Cesium.Primitive({
            geometryInstances: instances,
            appearance: new Cesium.PerInstanceColorAppearance({
                flat: true,
                translucent: false
            })
        }));
        const entity3 = new Cesium.Entity({
            name: "动态立体墙",
            wall: {
                positions: maskspoint,
                maximumHeights: maskspoint.map((res) => {
                    // return 600;
                    return 400;
                }),
                minimumHeights: maskspoint.map((res) => {
                    return -600;
                }),
                material: Cesium.Color.fromCssColorString("##2a373c"),
            },
        });
        this.viewer.entities.add(entity3);
    }

在初始化cesium的时候调用这个方法

 

标签:addRect,掩膜,135.0,instances,90.0,Cesium,cesium,new,3D
From: https://www.cnblogs.com/lxsunny/p/17792909.html

相关文章

  • 专访虚拟人科技:如何利用 3DCAT 实时云渲染打造元宇宙空间
    自古以来,人们对理想世界的探索从未停止,而最近元宇宙的热潮加速了这一步伐,带来了许多新的应用。作为元宇宙的关键入口,虚拟现实(VR)将成为连接虚拟和现实的桥梁。苹果发布的VISIONPRO头戴设备将人们对VR的关注推向了一个新的高度。在这个充满无限可能性的元宇宙中,杭州虚拟人科技有......
  • 基于WebGL+HTML5的智慧粮仓3D可视化系统
    仓廪实、天下安。民之所需,行之所至。建设背景古往今来,粮食问题历来是安邦定国的头等大事。“粮食”作为人类生活的生命之源,在人们的日常生活中起着决定性的作用。收获的粮食归仓,仓储工作是稳定“大国粮仓”的重要环节,当粮食收购后,如何让丰收成果颗粒归仓,减少损失,并确保粮食储藏质量......
  • Qt3D改变观察视角例程(二)
    本例依旧是改变3D视角。不同的是这个是视野位置不变而只改变观察方向。相当于一个人站在原地不动,旋转脑袋看周围的东西。测试的条件是VS2017和Qt5.9。主要的知识点就是欧拉角的计算。下面是效果图:头文件:classQOpenGLTexture;classQOpenGLBuffer;classMvOpenGLWidget:p......
  • Cesium 大量Poi点位数据采用primitiveCluster加载优化
    primitiveCluster.js文件import{BoundingRectangle,Cartesian2,Cartesian3,defaultValue,defined,EllipsoidalOccluder,Event,Matrix4,Billboard,BillboardCollection,Label,LabelCollection,PointPrimitive,PointPrimitiveCollect......
  • 如何在 Web 前端做 3D 音效处理
     一、背景在社交元宇宙、大逃杀等类型的游戏场景下,用户在通过简单语音交流外,结合场景也需要一些立体声效果来让用户感知游戏角色周围其他用户的存在及其对应的距离和方位,提高语音互动的趣味性。为了满足上述需求 ZEGOExpressWebSDK 从 v2.10.0(Native为v2.11.0)开始加入范......
  • [17章+电子书]C#速成指南-从入门到进阶,实战WPF与Unity3D开发
    点击下载:[17章+电子书]C#速成指南-从入门到进阶,实战WPF与Unity3D开发  提取码:a3s5 《C#速成指南--从入门到进阶,实战WPF与Unity3D开发》完整讲解了C#语言的核心知识和高阶编程技巧,并结合WPF客户管理系统和Unity3D切水果游戏两大实战项目,帮你实现技术的精通,完成从Zero到Hero的蜕变......
  • vray for 3dmax安装
    我下的版本是V-ray5.06for3dmax2019汉化版,安装包下载完后打开所在文件夹解压到VRay5.00.06for3dsmax2019然后打开解压完的文件运行打开安装程序,同意协议后点击install(安装过程3dmax打开会导致安装失败)安装完成后点击DONE然后退出在安装包里找到破解补丁打开......
  • 三维重建 PyQt Python MPR 四视图(横断面,冠状面,矢状面,3D)
    本文实现了PythonMPR的四视图,横断面,冠状面,矢状面,3DMPR(multi-plannerreformation)也称多平面重建,多重面重建是将扫描范围内所有的轴位图像叠加起来再对某些标线标定的重组线所指定的组织进行冠状、矢状位、任意角度斜位图像重组。主要功能:1:实现了所有切面与其他视图光标应该......
  • 面向Three.js开发者的3D自动纹理化开发包
    DreamTexture.js是面向three.js开发者的 3D模型纹理自动生成与设置开发包,可以为webGL应用增加3D模型的快速自动纹理化能力。图一为原始模型,图二图三为贴图后的模型。提示词:city,Realistic,cinematic,Frontview,Gamescenegraph1、DreamTexture.js开发包内......
  • cf353D. Queue(整体考虑转移)
    D.Queuef[i]表示第i个F需要多少时间才能让所有的M都移到她后面,那么我们考虑转移,分为两种情况。第i个F和第i-1个F挨着,那么显然f[i]=f[i-1]+1假如中间隔着一些M,可以分为两种情况,假如i可以在i-1完成之前追上它,那么就是f[i-1]+1,否则就说明i一直在进行交换,时间为在i之前的M的个数......