防汛可视化指挥平台“一张图”技术研究

         系统主要功能包括基础地图操作,如图形控制、对象选取、地图缩放、空间量算、动态图例、态势标会等功能;信息资源可视化应用,包括水系,水库,山洪灾害村,山洪易涝点,地质灾害点,汛期临时避险场所和安置点,重点企业等,每张图整合了一种本地业务数据进行地图空间表达,数据以专题图形式准确标绘在相应坐标点上,每个重点部位挂载了相关防汛数据,数据高度整合并结合空间数据的应用,为辅助指挥提供直观表达,可靠依据,责任人信息直达,充分体现了防汛指挥的“一张图”思想,使“一股绳”宗旨得意有效落实,构建了上下联动,统一行动,快速反应的防汛救灾体系;实时险情检测,物联网系统与GIS系统整合,实时调取点位视频图像,监测信息,设定阀值,关联告警,建立健全一套完整的快速反应防汛救灾体系。

图:危险河流

图:动态标会

图:危险地标

 


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title data-i18n="resources.title_buffersAnalystJobService"></title>
<script type="text/javascript" include="jquery,bootstrap,widgets" src="../js/include-web.js"></script>
<style>
        .control {
            position: absolute;
            top: 50px;
            right: 10px;
        }

        #map {
            position: absolute;
        }
    </style>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div id="map" style="width: 100%;height:100%"></div>
<div id="control" class="control" style='width:350px'>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title" data-i18n="resources.text_buffersAnalystJobService"></h3>
</div>
<div class="panel-body">
<div class="input-group">
<span class="input-group-addon"><span data-i18n="resources.text_inputData"></span><span data-i18n="[title]resources.text_requiredField" style="color: red;"> * </span> </span>
<input id="datasetName" type="text" class="form-control" value="samples_processing_newyorkPoint_P" />
</div>
<p></p>
<div class='input-group'>
<span class='input-group-addon' data-i18n="resources.text_analysisRange"></span>
<input id='bounds' type='text' class='form-control' value='-74.150, 40.550, -73.750, 40.950' />
</div>
<p></p>
<div class='input-group'>
<span class='input-group-addon' data-i18n="resources.text_bufferDistance"></span>
<input id='distace' type='text' class='form-control' value='15' />
</div>
<p></p>
<div class='input-group'>
<span class='input-group-addon' data-i18n="resources.text_bufferDistanceField"></span>
<input id='distanceField' type='text' class='form-control' value='pickup_latitude' />
</div>
<p></p>
<div class='input-group'>
<span class='input-group-addon' data-i18n="resources.text_bufferDistanceUnit"></span>
<select class='form-control' id='distanceUnit' name='distanceUnit'>
<option value='Meter' selected='selected'>Meter</option>
<option value='Kilometer'>Kilometer</option>
<option value='Yard'>Yard</option>
<option value='Foot'>Foot</option>
<option value='Mile'>Mile</option>
</select></div>
<p></p>
<div class='input-group'>
<span class='input-group-addon' data-i18n="resources.text_fusionField"></span>
<input id='dissoveField' type='text' class='form-control' value='pickup_longitude' />
</div>
<p></p>
<div align="right">
<input type="button" id='btn' class="btn btn-primary" data-i18n="[value]resources.text_analyst" />
</div>
</div>
</div>
</div>
<script type="text/javascript" src="../../dist/classic/include-classic.js"></script>
<script type="text/javascript">
        var host = window.isLocal ? window.server : "https://iserver.supermap.io";
        var resultLayer,
            processingsUrl = host + "/iserver/services/distributedanalyst/rest/v1/jobs",
            mapURL = host + "/iserver/services/map-world/rest/maps/World",
            map = new SuperMap.Map("map", {
                controls: [
                    new SuperMap.Control.Navigation(),
                    new SuperMap.Control.Zoom(),
                    new SuperMap.Control.LayerSwitcher()

                ],
                allOverlays: true
            });
        map.addControl(new SuperMap.Control.MousePosition());
        var layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", mapURL, null, {
            maxResolution: "auto"
        });
        layer.events.on({
            "layerInitialized": addLayer
        });

        function addLayer() {
            map.addLayers([layer]);
            map.setCenter(new SuperMap.LonLat(-73.95, 40.75), 12);
        }

        var processingService = new SuperMap.REST.ProcessingService(processingsUrl, {
            withCredentials: window.isLocal
        });
        SuperMap.SecurityManager.registerToken(processingsUrl, window.exampleToken);

        function getBounds() {
            if ($('#bounds').val() === "") {
                return "";
            }
            var bounds = [];
            $('#bounds').val().split(',').map(function (el) {
                bounds.push(parseFloat(el));
            });
            return new SuperMap.Bounds(
                bounds[0],
                bounds[1],
                bounds[2],
                bounds[3]
            );
        }

        $('#btn').on('click', function () {
            if ($('#msg_container')[0]) {
                $('#msg_container').remove();
            }
            widgets.loader.showLoader();
            if (map && resultLayer) {
                map.removeLayer(resultLayer);
            }
            var buffersAnalystJobsParameter = new SuperMap.BuffersAnalystJobsParameter({
                datasetName: $('#datasetName').val(),
                bounds: getBounds(),
                distance: $('#distace').val(),
                distanceField: $('#distanceField').val(),
                distanceUnit: $('#distanceUnit option:selected').attr('value'),
                dissolveField: $('#dissoveField').val()
            });
            processingService.addBuffersJob(buffersAnalystJobsParameter, function (serviceResult) {
                if (serviceResult.error) {
                    widgets.loader.removeLoader();
                    var errorMsg = serviceResult.error.errorMsg || "code: " + serviceResult.error.code;
                    widgets.alert.showAlert(resources.msg_createFailed + "<br>" + errorMsg, false);
                    return;
                }
                serviceResult.result.setting.serviceInfo.targetServiceInfos.map(function (info) {
                    if (info.serviceType === 'RESTMAP') {
                        SuperMap.FetchRequest.get(info.serviceAddress + '/maps').then(function (
                            response) {
                            return response.json();
                        }).then(function (result) {
                            var mapUrl = result[0].path;
                            resultLayer = new SuperMap.Layer.TiledDynamicRESTLayer(
                                "resultLayer", mapUrl, {
                                    transparent: true
                                });
                            resultLayer.events.on({
                                "layerInitialized": addLayer
                            });

                            function addLayer() {
                                map.addLayer(resultLayer);
                                widgets.loader.removeLoader();
                            }
                        });
                    }
                });
            });
        });
    </script>
</body>
</html>


posted @ 2021-07-01 09:44  GCloud_Blog  阅读(119)  评论(0编辑  收藏  举报