跳到主要内容
版本：9.4.1

3D等高面

空间连续分布对象空间聚集性的可视化表达，例如人流、污染物浓度等,支持动画连续播放热区或冷区的迁移和形态变化。

show
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>3D等高面</title>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"/>
    <style>
        body {
            margin: 0;
            padding: 0;
        }

        #map {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
        }
    </style>
    <script src="https://delivery.mapmost.com/cdn/sdk/webgl/v9.4.1/mapmost-webgl-min.js"></script>
</head>
<body>
<div id="map"></div>
<script>
        let map = new mapmost.Map({
            container: 'map',  
            style: "<your style url>", 
            center: [120.7285892158784,31.322079341989635], 
            zoom: 13.74, 
            pitch:58.499, 
            bearing:47.2, 
            userId: '***', // 授权码
        });
        
        map.on('load', function () {
            map.addSource('contour', {
                "type": "geojson",
                "data": data
            });
            map.addLayer({
                'id': 'contour-continuous',             // 图层 id（需唯一）
                'type': 'fill-extrusion',               // 类型
                'source': 'contour',                    // 数据源 id
                "paint": {
                    "fill-extrusion-color": {
                        'property': 'property',          // 根据属性 [property] 的值
                        'type': 'exponential',           // 按指数进行插值
                        'stops': [
                            [0.02, '#4a4a8b'],
                            [0.03, '#3887be'],
                            [0.05, '#56b881'],
                            [0.08, '#f1f075'],
                            [0.30, '#f9886c'],
                            [0.70, '#f54e5e'],
                        ],
                    },
                    "fill-extrusion-height":{              // 根据属性 [property] 的值
                        'stops': [[0, 10], [1, 1000]],     // 值 0 到 1，高度 10 到 1000
                        'property': 'property',
                        'base': 0.8,
                    },
                    "fill-extrusion-base": 0,             // 底高
                    "fill-extrusion-opacity": 0.8         // 透明度
                }
            });
      })
</script>
</body>
</html>