|  | <!DOCTYPE html>
<html lang="en">
<head>
    <title>地图</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="./lib/fengmap.map.min.js"></script>
    <script src="./lib/fengmap.plugin.min.js"></script>
    <script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="./style/fengmap.css">
</head>
<body>
    <div id="fengmap"></div>
</body>
<script>
    document.write("<s"+"cript type='text/javascript' src='./common/js/h5_game_common.js?version="+Math.random()+"'></scr"+"ipt>"); 
    var map;
    // let baseUrl='https://ctest.malls.iformall.com/C';
    let baseUrl='/C';
    $.ajax({
            url:baseUrl + "/api/fengniaomap/getConfig",
            type:"GET",
            dataType: "json", //返回数据格式为json
            headers: {
                'content-type':'application/json',
                "token":"c34103fa-1d40-4ba7-95a4-28975e1d9143:789:wx-cuser",
                // "token":getQueryString('token')
            },
            success:function(res){
                const data = res.data;
                let mapOptions = {
                    appName: data.appName,
                    key: data.appKey,
                    mapID: data.mapId,
                    container: document.getElementById("fengmap"),
                    // mapURL:  `/api/mapfile/${data.tenantId}/`,
                    // themeURL: `/api/mapfile/${data.tenantId}/theme/`,
                    mapURL:"./data/",
                    themeURL:"./data/theme/",
                    themeID: data.themeId,
                    level: data.defaultFloor
                }
                let map = new fengmap.FMMap(mapOptions);
                // let mapOptions = {
                //     appName: "金茂泊悦地图",
                //     key: "cb54a3aa3a7066ec99b565363f63cb8c",
                //     mapID: "1412326198669561858",
                //     container: document.getElementById("fengmap"),
                //     // mapURL:  `/api/mapfile/${data.tenantId}/`,
                //     // themeURL: `/api/mapfile/${data.tenantId}/theme/`,
                //     mapURL:"../../data/",
                //     themeURL:"../../data/theme/",
                //     themeID: '2001',
                //     level: 1
                // }
                let toolbarOptions = {
                    //控件产生
                    floorButtonCount: 3,
                    viewModeControl: true, //是否显示2、3D切换按钮,默认为true
                    floorModeControl: true, //	是否显示楼层控件,默认为true
                    needAllLayerBtn: true, //是否显示单多层按钮,默认为true
                    position: 3, //控件位置。分为左上 1、左下2、右上3、右下4。
                    offset: { x: 0, y: 166 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
                  };
                let zoomOptions = {
                    position: 3, //分为左上 1、左下2、右上3、右下4。
                    offset: { x: 0, y: 50 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
                  };
                  let compassOptions = {
                    position: 2 //分为左上 1、左下2、右上3、右下4。
                  };
                
                
                map.on("loaded", function() {
                    let toolbar = new fengmap.FMToolbar(toolbarOptions); //楼层控件
                    let zoomToolbar = new fengmap.FMZoomControl(zoomOptions); //缩放控件
                    let compass = new fengmap.FMCompass(compassOptions); //指南针控件
                    toolbar.addTo(map);
                    zoomToolbar.addTo(map);
                    compass.addTo(map);
    
                    compass.on("click", function() {
                      map.setRotation({
                        rotation: 0,
                        animate: true,
                        duration: 0.3,
                        finish: function() {
                        //   console.log("setRotation");
                        }
                      });
                    });
                  });
            }
        })
    // setTimeout(() => {
    //     var options = {
    //     appName: '金茂泊悦地图',
    //     key: 'cb54a3aa3a7066ec99b565363f63cb8c',
    //     mapID: '1412326198669561858',
    //     container: document.getElementById('fengmap'),
    //     mapURL: './data/',
    //     themeURL: './data/theme/',
    //     themeID: '2001',
    // }
    // let toolbarOptions = {
    //     //控件产生
    //     floorButtonCount: 3,
    //     viewModeControl: true, //是否显示2、3D切换按钮,默认为true
    //     floorModeControl: true, //	是否显示楼层控件,默认为true
    //     needAllLayerBtn: true, //是否显示单多层按钮,默认为true
    //     position: 3, //控件位置。分为左上 1、左下2、右上3、右下4。
    //     offset: { x: 0, y: 166 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
    // };
    // let zoomOptions = {
    //     position: 3, //分为左上 1、左下2、右上3、右下4。
    //     offset: { x: 0, y: 50 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
    // };
    // let compassOptions = {
    //     position: 2 //分为左上 1、左下2、右上3、右下4。
    // };
    // map = new fengmap.FMMap(options);
    // map.on('loaded', function () {
    //     let toolbar = new fengmap.FMToolbar(toolbarOptions); //楼层控件
    //     let zoomToolbar = new fengmap.FMZoomControl(zoomOptions); //缩放控件
    //     let compass = new fengmap.FMCompass(compassOptions); //指南针控件
    //     toolbar.addTo(map);
    //     zoomToolbar.addTo(map);
    //     compass.addTo(map);
    //     compass.on("click", function () {
    //         map.setRotation({
    //             rotation: 0,
    //             animate: true,
    //             duration: 0.3,
    //             finish: function () {
    //                 //   console.log("setRotation");
    //             }
    //         });
    //     });
    // });
    // }, 2000);
    
</script>
</html>
 |