Cesium添加PNG透明图片有背景色的解决办法

江苏省精神病院玛主任

已于 2023-02-23 10:12:44 修改

阅读量1.2k

点赞数

文章标签： javascript GIS

于 2023-02-23 10:11:45 首次发布

本文链接：https://blog.csdn.net/JINX1024/article/details/129175932

版权

文章介绍了在使用Cesium时遇到的问题，即通过官方方法添加图片到矩形上会产生白色背景。为了解决这个问题，作者采用了贴纹理的方式，通过ImageMaterialProperty来添加图片，这样可以避免背景出现，实现透明背景的效果。

摘要由CSDN通过智能技术生成

一开始的时候是用官方给的方法，先贴了一个矩形然后再贴图片，导致图片会有白色背景，很不好，之后采用了贴纹理的方法增加图片，这样就不会有背景了。

Maps.prototype.addcloud = function(){
  imgUrl = "./src/assets/vissr.png",
  this.viewer.entities.add({
    id: "Textured rectangle, zIndex 2",
    rectangle: {
      coordinates: Cesium.Rectangle.fromDegrees(
        45.0,
        -65.0,
        165.0,
        60.0
      ),

    
      material:new Cesium.ImageMaterialProperty({
        // 纹理
        image: imgUrl,
        // repeat: new Cesium.Cartesian2(4, 4),
        // color: Cesium.Color.BLUE,
        transparent:true
      }),
      zIndex: 2,
    },
  });  

}