3D智慧电商大屏,三维建筑物地图呈现,效果酷炫

58 阅读1分钟

1 首先看下效果,用了mapbox

微信图片_20230313173051.png 2 地图的主要效果,渐变的效果参见如下: map.addLayer({ 'id': '3d-buildings', 'source': 'composite', //在线的 'source-layer': 'building', 'filter': ['==', 'extrude', 'true'], 'type': 'fill-extrusion', 'minzoom': 15, 'paint': { 'fill-extrusion-color': [ 'interpolate', ['linear'], ['get', 'height'], 0, '#845EC2', 75, '#86A8E7', 150, "#5FFBF1", ], 'fill-extrusion-height': ['get', 'height'], 'fill-extrusion-opacity': .6 //透明度 } }); 3 弹出的对话框,修改mapbox.css