fuyuhang
/
Project_yhfu
mirror of http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title data-i18n="resources.title_overlayLayer"></title>
    <style type="text/css">
        body {
            margin: 0;
            overflow: hidden;
            background: #fff;
            width: 100%;
            height: 100%
        }

        #map {
            position: absolute;
            width: 100%;
            height: 100%;
        }
        .editPane {
            position: absolute;
            right: 10px;
            top: 50px;
            width: 350px;
            text-align: center;
            background: #FFF;
            z-index: 1000;
        }
    </style>
</head>
<body>
<div id="map">
    <div class='panel panel-primary editPane' id='editPane' style="z-index: 99999">
        <div class='panel-heading'>
            <h5 class='panel-title text-center' data-i18n="resources.text_mapOverlay"></h5>
        </div>
        <div class='panel-body' id='params'>
            <div class='input-group'>
                <span class='input-group-addon' data-i18n="resources.text_opacity"></span>
                <input id='layerOpacity' type='text' class='form-control' data-i18n="[placeholder]resources.text_input_tips_opacity"/>
            </div>
            <p></p>
            <div align='right' class='input-group'>
                <input type='button' id='calc' class='btn btn-primary' data-i18n="[value]resources.btn_createOpacity" onclick="setLayerOpacity()"/>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
<script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
<script type="text/javascript">
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var map, layerWorld, layerJingjing;
    var url = host + "/iserver/services/map-world/rest/maps/World";
    var url2 = host + "/iserver/services/map-jingjin/rest/maps/京津地区人口分布图_专题图";
    map = new SuperMap.Map("map", {
        controls: [
            new SuperMap.Control.LayerSwitcher(),
            new SuperMap.Control.ScaleLine(),
            new SuperMap.Control.OverviewMap(),
            new SuperMap.Control.Zoom(),
            new SuperMap.Control.Navigation({
                dragPanOptions: {
                    enableKinetic: true
                }
            })], allOverlays: true
    });
    layerWorld = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
        transparent: true,
        cacheEnabled: true
    });
    layerWorld.events.on({"layerInitialized": addLayer1});
    function setLayerOpacity() {
        var numStr = document.getElementById('layerOpacity').value;
        if (numStr && !isNaN(numStr)) {
            if (Number(numStr) >= 0 && Number(numStr) <= 1) {
                layerJingjing.setOpacity(Number(numStr));
            }
        }
    }
    function addLayer1() {
        layerJingjing = new SuperMap.Layer.TiledDynamicRESTLayer("京津地区地图", url2, {
            transparent: true,
            cacheEnabled: true
        });
        layerJingjing.events.on({"layerInitialized": addLayer2});
        layerJingjing.setOpacity(0.8);
    }
    function addLayer2() {
        map.addLayers([layerWorld, layerJingjing]);
        map.setCenter(new SuperMap.LonLat(118, 40), 7);
    }
</script>
</body>
</html>