首页 / 浏览问题 / 云GIS / 问题详情
mapbox加载两个tile图层,让上面图层背景色透明
erge2  (39EXP)  初出茅庐
9月2日, 2019
mapbox 加载两个raster图层,上边图层有白色的背景,一直遮盖下面图层。在leaflet中有transparent属性,可以设置背景透明。mapbox,怎么设置背景透明啊。下面是代码:

var map = new mapboxgl.Map({

container: 'map',

style: {

'version': 8,

'sources': {

'raster-tiles': {

'attribution': attribution,

'type': 'raster',

// 'transparent': true,

'tiles': ['http://support.supermap.com.cn:8090/iserver/services/maps/rest/maps/World/zxyTileImage.png?prjCoordSys={"epsgCode":3857}&z={z}&x={x}&y={y}'],

'tileSize': 256

}

},

'layers': [{

'id': 'simple-tiles',

'type': 'raster',

'source': 'raster-tiles',

'minzoom': 0,

'maxzoom': 22

}],

'sprite': 'http://iclient.supermap.io/web/styles/street/sprite'

},

center: [0, 0],

maxZoom: 18,

zoom: 2

})

map.addControl(new mapboxgl.NavigationControl(), 'top-left')

map.on('load', () => {

debugger

map.addSource('firstLayer', {

type: 'raster',

// transparent: true,

tiles: ['http://support.supermap.com.cn:8090/iserver/services/map-jingjin/rest/maps/京津地区地图/zxyTileImage.gif?prjCoordSys={"epsgCode":3857}&z={z}&x={x}&y={y}'],

// tiles: ['http://192.168.113.142:8090/iserver/services/map-waterfront/rest/maps/image/zxyTileImage.png?z={z}&x={x}&y={y}'],

tileSize: 256

})

map.addLayer({

id: 'firstLayer',

type: 'raster',

paint: {

'raster-opacity': 0.7,

// 'raster-transparent': true,

'raster-opacity-transition': {

'duration': 0

},

'raster-fade-duration': 5

},

source: 'firstLayer',

minZoom: 0

})

})

1个回答

于浩  (5,668EXP)  登峰造极
9月2日, 2019
这个方法可以,还有其他方法吗?

看了一下mapbox官方API中没有raster的背景透明的设置,https://docs.mapbox.com/mapbox-gl-js/style-spec/#layers-raster

建议先使用这个方法,后续会尝试实现背景透明的功能,如果有结果再给您发

...