fuyuhang
/
Project_yhfu
镜像自地址 http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title data-i18n="resources.title_saveload"></title>
    <style type="text/css">
        #map {
            position: absolute;
            left: 250px;
            right: 0px;
            height: 100%;
        }

        #plottingPanel {
            float: left;
            background: #ffffff;
            width: 250px;
            height: 100%;
            border: 1px solid #3473b7;
        }

        #plottingMenu {
            position: absolute;
            top: 20%;
            z-index: 999999;
            border-radius: 4px;
            padding-top: 2px;
            left: 265px;
            color: #000000;
            background-color: #fff;
        }
    </style>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div id="toolbar" class="panel panel-primary" style=" position: absolute;top: 15px;right: 20px;text-align: center;z-index: 9999;border-radius: 4px;">
    <div class='panel-heading' id="panelheading">
        <h5 class='panel-title text-center' data-i18n="resources.title_saveload" style="  font-size: 16px;color: #ffffff;"></h5>
    </div>
    <div class='panel-body content' id="panelbodycontent" style="overflow:hidden;">
        <div class='panel' >
            <div class='input-group' style="margin-top:15px;margin-left: 5px; margin-bottom: 10px;text-align: center">
                <select class="search-query form-control" id="SLT" style="width: 150px"></select>
                <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_load" onclick="loadSimulationMap()"/>
                <input type="button" class="btn btn-default " data-i18n="[value]resources.btn_save" onclick="save()"/>
                <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_saveAs" onclick="saveAsSmlFile()"/>
                <input type="text" id="txt" class='form-control' style="width: 120px;float: right;margin-right: 5px;"/>
            </div>
        </div>
    </div>
</div>
<div id="plottingPanel">
    <div class="easyui-panel" style="position:absolute;top:0px;bottom:0px;left:0px;right:0px;padding:5px; width: 100%;">
        <div class="easyui-tabs" style="width: 100%;height: 100%">
            <div id="plotPanel" data-i18n="[title]resources.text_drawPanel" style="overflow: hidden"></div>
            <div id="stylePanel" data-i18n="[title]resources.text_attributePanel"></div>
        </div>
    </div>
</div>
<div id="plottingMenu" class="sticklr">
    <li>
        <a class="glyphicon plotting-glyphicon-draw-deactivate notArrow"
           data-i18n="[title]resources.text_cancelDraw"
           onclick="cancelDraw()"></a>
    </li>
    <li>
        <a class="glyphicon plotting-glyphicon-draw-removeAll notArrow"
           data-i18n="[title]resources.text_input_value_clear"></a>
        <ul>
            <li><input type="button" data-i18n="[value]resources.btn_deleteMarker" onclick="deleteSymbol()"
                       style="width:70px;height: 25px ;margin:0 auto;"/> </li>
            <li><input type="button" data-i18n="[value]resources.btn_clearLayers" onclick="clearLayer()"
                       style="width: 70px;height: 25px ;margin:0 auto;"/></li>
        </ul>
    </li>
</div>
<div id="map"></div>
<script type="text/javascript" include="bootstrap,sticklr,widgets.alert,plottingPanel" src="../js/include-web.js"></script>
<script type="text/javascript" include="iclient-plot-leaflet" src="../../dist/leaflet/include-leaflet.js"></script>
<script type="text/javascript" include="PlotPanel,StylePanel" src="../js/plottingPanel/PlottingPanel.Include.js"></script>
<script type="text/javascript">
    var host = window.isLocal ? window.server : "https://iserver.supermap.io";
    var url = host + "/iserver/services/map-china400/rest/maps/China_4326";
    var serverUrl = host + "/iserver/services/plot-jingyong/rest/plot/";
    var map;
    map = L.map('map', {
        preferCanvas: true,
        crs: L.CRS.EPSG4326,
        center: [35,104],
        maxZoom: 18,
        zoom: 3
    });
    L.supermap.tiledMapLayer(url).addTo(map);
    var plottingLayer = L.supermap.plotting.plottingLayer("plot", serverUrl);
    plottingLayer.spatialAnalystUrl=host+"/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst";
    plottingLayer.addTo(map);
    var drawControl = L.supermap.plotting.drawControl(plottingLayer);
    drawControl.addTo(map);
    var editControl = L.supermap.plotting.editControl();
    editControl.addTo(map);
    L.supermap.plotting.initPlotPanel("plotPanel", serverUrl, drawControl);
    L.supermap.plotting.initStylePanel("stylePanel", serverUrl, editControl);
    var plotting = L.supermap.plotting.getControl(map, serverUrl);
    var sitDataManager = plotting.getSitDataManager();

    //获取态势图列表
    function getSMLInfos() {
        sitDataManager.getSMLInfos(0, 10, function(evt){
            var result = evt.smlInfoList;
            var select = document.getElementById("SLT");
            while (select.hasChildNodes()) {
                select.removeChild(select.firstChild);
            }
            for (var i = 0, len = result.length; i < len; i++) {
                var options = document.createElement("option");
                options.setAttribute("value", result[i].SMLFileName);
                options.innerHTML = result[i].SMLFileName;
                select.appendChild(options);
            }
            return false;
        });
    }

    //加载态势图
    function loadSimulationMap() {
        widgets.alert.clearAlert();
        var select = document.getElementById("SLT");
        for (var i = 0; i < select.children.length; i++) {
            if (select.children[i].selected) {
                sitDataManager.openSmlFileOnServer(select.children[i].value, function(evt){
                    if(evt.success){
                        drawControl.setDrawingLayer(evt.sitDataLayers[0]);
                        widgets.alert.showAlert("加载态势图成功！",true);
                    } else {
                        widgets.alert.showAlert("加载态势图失败！",true);
                    }
                });
            }
        }
    }

    //保存态势图
    function save() {
        widgets.alert.clearAlert();
        drawControl.handler.disable();
        sitDataManager.saveSmlFile(function(evt){
            if(evt.success){
                getSMLInfos();
                widgets.alert.showAlert("保存态势图成功！",true);
            } else {
                widgets.alert.showAlert("保存态势图失败！",true);
            }
        });
    }

    //另存态势图
    function saveAsSmlFile() {
        widgets.alert.clearAlert();
        var  SMLName = document.getElementById("txt").value;
        if (SMLName.length !== 0) {
            drawControl.handler.disable();
            sitDataManager.saveAsSmlFile(SMLName, function(evt){
                if(evt.success){
                    getSMLInfos();
                    widgets.alert.showAlert("保存态势图成功！",true);
                } else {
                    widgets.alert.showAlert("保存态势图失败！",true);
                }
            });
        } else {
            widgets.alert.showAlert("请输入另存为态势图的名字",true);
        }
    }
    //取消标绘
    function cancelDraw() {
        drawControl.handler.disable();
    }
    //删除选中标号
    function deleteSymbol() {
        editControl.deleteSelectedFeatures();
    }
    //清空绘制
    function clearLayer() {
        cancelDraw();

        for (var i = 0; i < map.getPlottingLayers().length; i++) {
            map.getPlottingLayers()[i].removeAllFeatures();
        }
    }
    window.onload = function(){
        getSMLInfos();//初始化页面时获取态势图列表
    };
    $(document).ready(function(){
        $('#panelheading').click(function(){
            $('#panelbodycontent').toggle();
        });
    });
</script>
</body>
</html>