跳到主要内容

高程分层设色与CSS颜色

高程分层设色与共享CSS颜色(08.15b)

color-relief使用共同raster-dem图源。color-relief-color支持常量CSS颜色、以"elevation"为米制输入的linear interpolate或step色带,最多32个严格递增节点(绝对值不超过1e8),节点颜色须为常量;缺省黑色。linear在节点之间插值RGBA、超范围钳制;step在阈值处采用新颜色。支持负高程,透明nodata不着色。输入专用于高程颜色带,不伪造业务字段。

map.addLayer({id:'relief',type:'color-relief',source:'dem',paint:{
 'color-relief-color':['interpolate',['linear'],['elevation'],
   -100,'#2563eb',0,'lime',2000,'rgb(160 100 40)',5000,'white'],
 'color-relief-opacity':0.8
}});
map.setPaintProperty('relief','color-relief-color',[
 'step',['elevation'],'blue',0,'lime',2000,'brown',5000,'white'
]);
await map.sqs.flush({render:true});

opacity默认1、范围0..1,允许共同zoom表达式,最终alpha为颜色alpha乘opacity一次。图层复用DEM缓存;颜色/opacity修改、排序、缩放与显隐更新派生纹理版本,不修改原始高程。无矢量要素/feature-state/filter;球面、3D地形贴地、其它插值模式/节点颜色表达式和完整高程专有表达式继续待实施。预算与raster-dem/hillshade相同。

共同circle/line/fill/fill-extrusion、symbol、background、heatmap及高程颜色统一复用既有CSS解析器:十六进制、148个命名颜色、RGB/RGBA和HSL/HSLA,包括大小写、百分比、空格/斜杠与角度单位。沿用sRGB字节插值;无效/非有限输入拒绝,不承诺其它色彩空间。

完整HTML/CSS/按钮事件示例使用SqsMap自行生成的演示高程,非真实地形。实际用户需替换图源并显示数据提供者要求的署名。参数命名参考MapLibre color-relief规范,实现由SqsMap自行编写。