目录
存在的问题
- 将地图的底图背景透明SceneView设置背景无效
- map的数据框背景颜色设置为透明后,放在basemap的图层也会变成透明
- 背景图片设置无效,被背景总是黑色
SceneView设置为透明
ArcGIS API for JavaScript 4.X中的SceneView有一个环境参数environment,将其背景(background)的颜色设置为透明,按道理就实现了背景透明。
this.view = new SceneView({
container: "mapDIV",
map: webMap,
environment: {
background: {
type: 'color',
color: [255, 255, 0, 0],
},
},
});
可是并无任何效果, 然后查看环境参数的属性,需要将氛围属性atmosphereEnabled设置为false。
Map设置为透明
SceneView设置为透明后,如果底图为区域不是全球的情况下,底图的数据范围还是会有默认的颜色存在,此时需要将Map和WebScene的ground将Ground中的opacityopacity值设置为0。
let map = new WebScene({
ground: {surfaceColor: "#1b2540",opacity: 0.01,},
layers:[baseLayer]
});
提示:因为将ground的透明度设置为0,在basemap中的图层也会变成透明,所以不能用使用API中带有的底图切换工具,例如BasemapGallery、BasemapLayerList、BasemapToggle等;但不影响ground中配置的ElevationLayer。
设置背景图片
当你成功将背景变为透明,可是无论你怎么设置装地图DOM的背景图片,始终都不会出来,一直都是黑的,而此时你只需要将SceneView中的alphaCompositingEnabled属性设置为true,这样你的背景图片就会显示出来。
let map = new WebScene({
ground: {
surfaceColor: "#1b2540",
opacity: 0.01,
},
layers:[baseLayer]
});
self.view = new SceneView({
container: "mapDIV",
map: map,
alphaCompositingEnabled: true,
environment: {
background: {
type: 'color',
color: [255, 255, 0, 0],
},
starsEnabled: true,
atmosphereEnabled: false,
},
});
注意:在API中的解释,启用了alphaCompositingEnabled属性后,SceneView的性能会降低,所以非必要情况下还是沿用与系统相似的背景色