版本：9.0.0
三维量测

三维量测工具，提供对三维模型测距离、测面积的支持。
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="Expires" CONTENT="0">
    <meta http-equiv="Cache-Control" CONTENT="no-cache">
    <meta http-equiv="Pragma" CONTENT="no-cache">

    <title>三维量测</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%;
        }

        #buttons {
            position: absolute;
            display: flex;
            flex-direction: row;
            z-index: 100;
        }
    </style>
    <script src="https://delivery.mapmost.com/cdn/sdk/webgl/v9.0.0/mapmost-webgl-min.js"></script>
    <script src="https://delivery.mapmost.com/cdn/sdk/plugins/mapmost-webgl-measure3D/v1.1.0/mapmost-webgl-measure3D.js"></script>
</head>

<body>
    <div id="buttons">
        <div><button type="button" style="margin-left: 5px;" onclick="distance()">距离测量</button></div>
        <div><button type="button" style="margin-left: 5px;" onclick="area()">面积测量</button></div>
        <div><button type="button" style="margin-left: 5px;" onclick="clearMeas()">清除测量</button></div>
    </div>
    <div id="map"></div>
    <script>
        let map = new mapmost.Map({
            container: 'map',
            name: 'ditu',
            style: "<your style url>",
            doubleClickZoom: false,
            center: [120.67727020663829, 31.31997024841401],
            zoom: 16.810035105070947,
            pitch: 59.48725112156901,
            bearing: -54.10626584095007,
            userId: '***', // 授权码
            env3D: {
                envMap: "../../example_data/hdr/WhiteBG_Ref_1K.hdr",
                exposure: 2.8,
            },
            userId: "<your userId>"
        });
        var meas;
        map.on('load', function () {
            let models_obj = ["jinji_plaza_bridge", "jinji_plaza_bridge_upper", "jinji_plaza_eastern_door_building", "jinji_plaza_fence",
                "jinji_plaza_north_building", "jinji_plaza_star_vista", "jinji_plaza_surface", "jinji_plaza_suzhou_center", "jinji_plaza_w"].map(item => ({
                    type: 'glb',
                    url: "../../example_data/jjh_Scene_Y/" + item + ".glb",
                }));
                
            let options = {
                id: 'model_id',
                type: 'model',
                models: models_obj,
                center: [120.67727020663829, 31.31997024841401, 0.0],
                callback: function (group, layer) {
                    meas = new Measure3D(map);
                }
            };
            map.addLayer(options);
        })

        function distance() {
            // 距离测量
            meas.setType("distance");
        }
        function area() {
            // 面积测量
            meas.setType("area");
        }
        function clearMeas() {
            // 清除绘制
            meas.clear();
        }
    </script>
</body>

</html>