cesium 解决带高度的polygon 材质不能透明的问题

问题描述:创建一个带高度的polygon,用一个带透明度的图片做材质,画出来的多边形没有透明效果,图片的透明通道没有用上。

一、创建不带高度polygon

不带高度的polygon,使用带透明度的图片是有效果的,但是不带高度的话,polygon是自动贴模型的,如果在polygon的上面还有模型,那么这个多边形也会贴到上面的模型上去。

let coors = [
                113.296373, 38.189969,
                113.29641, 38.189979,
                113.296289, 38.190231,
                113.296252, 38.190222,                
            ]
            viewer.entities.add({
                polygon: {
                    hierarchy: Cesium.Cartesian3.fromDegreesArray(coors),
                    material: new Cesium.ImageMaterialProperty({
                        image: './image/fence.png'
                    })
                },
            });

二、创建带高度的polygon

let coors = [
                113.296373, 38.189969,
                113.29641, 38.189979,
                113.296289, 38.190231,
                113.296252, 38.190222,                
            ]
            viewer.entities.add({
                polygon: {
                    hierarchy: Cesium.Cartesian3.fromDegreesArray(coors),
                    material: new Cesium.ImageMaterialProperty({
                        image: './image/fence.png'
                    }),
                    height: 1
                },
            });

三、创建带高度的polygon+设置material的color:即可解决此问题

let coors = [
                113.296373, 38.189969,
                113.29641, 38.189979,
                113.296289, 38.190231,
                113.296252, 38.190222,                
            ]
            viewer.entities.add({
                polygon: {
                    hierarchy: Cesium.Cartesian3.fromDegreesArray(coors),
                    material: new Cesium.ImageMaterialProperty({
                        image: './image/fence.png',
                        color: Cesium.Color.fromCssColorString('rgba(255, 255, 255,0.6)')
                    }),
                    height: 1
                },
            });

1、如果不想改变图片的颜色,那么color的rgb必须是(255, 255, 255)

2、color的透明度a必须小于1,原图片的透明效果才能看到

相关推荐
不浪brown2 天前
开源!Cesium视频投射,手把手教你如何让实时视频流“长”在三维地球里!
cesium
整点可乐4 天前
cesium热力图曲面简单实现,使用heatmap
前端·cesium
不浪brown7 天前
应急指挥&污染扩散模拟 | Cesium 多边形动态扩散墙实战教程(附源码)
前端·cesium
枝上棉蛮11 天前
如何用GISBox将高斯泼溅文件(PLY/Splat)转换为3DTiles?全流程解析
gis·cesium·ply·3dtiles·高斯泼溅·gis软件·splat
白嫖叫上我1 个月前
Ceisum无人机巡检直播视频投射
无人机·cesium·webgis
easyCesium1 个月前
大疆机场及无人机上云
cesium·dji
一嘴一个橘子1 个月前
Entity 的材质(棋盘、条纹、网格)
cesium
一嘴一个橘子1 个月前
primitive 的 Appearance编写着色器材质
cesium
一嘴一个橘子1 个月前
primitive 编写着色器材质
cesium
不浪brown1 个月前
【开源】Cesium中让模型动起来,丝滑又顺畅
前端·cesium