跳到主要内容
版本：9.1.0

加载专题建筑-模型版

基于模型及贴图渲染3D建筑专题图层，此方式可加载大面积的建筑模型(已测试南京16万栋建筑的流畅加载)，建筑模型需按规定流程制作（具体流程请联系Mapmost团队）。

show
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>add buildings model</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.1.0/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.746213168539995, 31.305705042336399], 
        zoom: 12, 
        pitch: 60, 
        userId: '***', // 授权码
        env3D: {
                defaultLights: false,
        }
    });

    map.on('load', function () {
        let light1 = new mapmost.AmbientLight({
            color: '#0000ff',
            intensity: 2
        });

        let light2 = new mapmost.DirectionalLight({
            color: '#ffffff',
            intensity: 0.25,
            position: [0, 8000, 10000]
        });

        map.addLight(light1)
        map.addLight(light2)

        // 建筑模型，可增加多个
        let models_obj = [{
            type: 'glb',
            url: "./SZYQ.glb"
        }];

        let op = {
            id: 'sipsg',
            type: 'buildings',
            images: ['./top.png', './wall_reverse.png'], // 顶和墙的贴图
            models: models_obj,
            center: [120.7464153334825, 31.333162198642274],
        };

        map.addLayer(op);
    })
</script>
</body>
</html>