基于3DGIS的市政消火栓水压监测系统

       紧紧围绕“核心功能区”战略定位,以需求为导向,以应用为核心,按照“平台优先、应用至上”建设思路,采取“1+1”模式,即一个“系统总体”(共性平台)和一个“分类专项”(应用示范——市政消防栓智能管理系统),通过技术和应用创新,成为“智慧消防”建设的实战平台、科研平台、演练平台和培训平台。

  以虚拟现实技术为基础,以数据为核心,以流程为线索,以事件为驱动,综合应用GIS、物联网、人工智能、数据可视化、自动化控制等技术,建立基于3DGIS的市政消火栓管控系统,通过多源多模信息融合、数据分析、模式发现和信息展示,服务于市政消火栓状态监控与管理、事故预警与预测、事件的分析与决策、任务发布与下达等业务应用,并具有信息全景化、数据可视化、流程信息化、预案沙盘化、展示临场化和管理精细化的特点。

  (1)独立三维场景

  大坪街道、解放碑街道三维电子沙盘各设计为一个独立的三维场景。

  (2)辖区外标识

  辖区外重要的公路等交通干线、附近地区重要的企、事业单位和厂矿,二维地图加名称、文字标识出来。

  (3)两类三维模型

  第一类为采用倾斜摄影技术建模,如本项目区域内的大型建筑、地形地貌、市政道路、园林植被等;第二类为手工建模,如消火栓等设备设施及地下供水管网等。

  (4)倾斜摄影模型大坪街道与卫星图衔接效果

  

  (5)解放碑街道建筑物的模型和地面的卫星图衔接表现效果

  

  (6)消火栓与现场监测数据集成

  通过物联网,将消火栓的水压监测设备的监测数据实时上传,并进行集成管理应用。

  (7)人员定位数据集成

  (8)平台功能

  


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title data-i18n="resources.title_animatorMigrate"></title>
<style type="text/css">
        body {
            margin: 0;
            overflow: hidden;
            background: #fff;
             100%;
            height: 100%
        }

        #map {
            position: absolute;
             100%;
            height: 100%;
        }

        #toolbar {
            position: absolute;
            top: 50px;
            right: 10px;
             230px;
            text-align: center;
            z-index: 100;
            border-radius: 4px;
        }
    </style>
</head>
<body>
<div id="toolbar" class="panel panel-primary">
<div class='panel-heading'>
<h5 class='panel-title text-center' data-i18n="resources.title_animatorMigrate"></h5></div>
<div class='panel-body content'>
<div class='panel'>
<div class='input-group'>
<label data-i18n="resources.text_currentTime" style="display:inline"></label>
<label style="display:inline" id="timeDate"></label>
<label style="display:inline" id="timeHour"></label>
</div>
</div>
<input type="button" class="btn btn-default" data-i18n="[value]resources.btn_play" onclick="startAnimator()"/>&nbsp;
<input type="button" class="btn btn-default" data-i18n="[value]resources.btn_pause" onclick="pauseAnimator()"/>
</div>
</div>
<div id="map"></div>
<script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
<script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
<script type="text" id="cartocssStr">
    @color:#111;
    #World_Continent_txt___China::hover{
    text-fill:#0f0;
    }
    #World_Division_pl___China{
    polygon-fill:#123;
    ::click{
    polygon-fill:#123;
    }
    }
    #World_Continent_pl___China{
    polygon-fill:#000002;
    line-1;
    line-color:#888;
    ::hover[featureID=73]{
    polygon-fill:#f00;
    }
    }
    #China_Capital_Pt___China [zoom>4] {
    point-file:url("../examples/images/marker2.png");
    }
    #China_Province_pl___China{
    polygon-fill:#555;
    }
    #China_Boundary_A___China{
    line-color:#000000;
    }






</script>
<script>
    var map, layer, animatorVector, vectorLayer, url2,
        host = window.isLocal ? window.server : "https://iserver.supermap.io",
        url = host + "/iserver/services/map-china400/rest/maps/China",
        url2 = host + "/iserver/services/data-DynamicData/rest/data";
    var items = [
        {
            start: 0,
            end: 101,
            length: 55,
            style: {
                strokeOpacity: 1,
                strokeColor: "#000000",
                strokeWidth: 1
            }
        },
        {
            start: 101,
            end: 201,
            length: 60,
            style: {
                strokeOpacity: 1,
                strokeColor: "#0000FF",
                strokeWidth: 1.5
            }
        },
        {
            start: 201,
            end: 301,
            length: 65,
            style: {
                strokeOpacity: 1,
                strokeColor: "#FF00FF",
                strokeWidth: 2
            }
        },
        {
            start: 301,
            end: 401,
            length: 70,
            style: {
                strokeOpacity: 1,
                strokeColor: "#FF0000",
                strokeWidth: 2.5
            }
        },
        {
            start: 401,
            end: 501,
            length: 75,
            style: {
                strokeOpacity: 1,
                strokeColor: "#FFCCFF",
                strokeWidth: 3
            }
        },
        {
            start: 501,
            end: 601,
            length: 80,
            style: {
                strokeOpacity: 1,
                strokeColor: "#00FF00",
                strokeWidth: 3.5
            }
        },
        {
            start: 601,
            end: 701,
            length: 85,
            style: {
                strokeOpacity: 1,
                strokeColor: "#00FFFF",
                strokeWidth: 4
            }
        },
        {
            start: 701,
            end: 801,
            length: 90,
            style: {
                strokeOpacity: 1,
                strokeColor: "#FFFF00",
                strokeWidth: 4.5
            }
        },
        {
            start: 801,
            end: 901,
            length: 95,
            style: {
                strokeOpacity: 1,
                strokeColor: "#66CCCC",
                strokeWidth: 5
            }
        },
        {
            start: 901,
            end: 1001,
            length: 100,
            style: {
                strokeOpacity: 1,
                strokeColor: "#FF9999",
                strokeWidth: 5.5
            }
        }

    ];

    init();

    function init() {

        if (!document.createElement('canvas').getContext) {
            widgets.alert.showAlert(resources.msg_supportCanvas, false);
            return;
        }
        //初始化地图
        map = new SuperMap.Map("map", {
            controls: [
                new SuperMap.Control.ScaleLine(),
                new SuperMap.Control.Zoom(),
                new SuperMap.Control.Navigation({
                    dragPanOptions: {
                        enableKinetic: true
                    }
                })],
            projection: "EPSG:3857"
        });
        //初始化图层
        var cartoCssStr = document.getElementById("cartocssStr");
        var cartoCss = cartoCssStr.text;
        var layerNames = ["World_Division_pl@China", "World_Continent_pl@China",
            "China_Province_pl@China", "China_Island@China",
            "China_Capital_Pt@China", "China_Boundary_A"].join(",");
        layerNames = "[" + layerNames + "]";
        layer = new SuperMap.Layer.TiledVectorLayer("China", url, {
            cacheEnabled: true,
            layerNames: layerNames
        }, {useLocalStorage: true, cartoCSS: cartoCss});
        layer.events.on({"layerInitialized": addLayer});

    }

    function addLayer() {
        //初始化动画矢量图层
        animatorVector = new SuperMap.Layer.AnimatorVector("春运", {rendererType: "RadiatePoint"}, {
            frameRate: 20,
            //设置速度为每帧播放0.01小时的数据
            speed: 0.01,
            //开始时间为0晨
            startTime: 0,
            //结束时间设置为第七天,也就是大年三十
            endTime: 7
        });
        animatorVector.renderer.items = items;
        animatorVector.renderer.dataField = "POPULATION";
        animatorVector.animator.events.on({"framestart": framestart});
        vectorLayer = new SuperMap.Layer.Vector("point");
        map.addLayers([layer, animatorVector, vectorLayer]);
        map.setCenter(new SuperMap.LonLat(12009634.286396, 4208716.5813769), 5);
        //增加数据
        addMigrate();

    }

    function framestart(time) {
        //从服务端获取数据
        var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;

        getFeatureParam = new SuperMap.REST.FilterParameter({
            name: "Migrate@DynamicData",
            attributeFilter: "SmID < 809"
        });
        getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
            queryParameter: getFeatureParam,
            datasetNames: ["DynamicData:Migrate"]
        });
        getFeatureBySQLParams.toIndex = 808;
        getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(url2, {
            eventListeners: {"processCompleted": processCompleted, "processFailed": processFailed}
        });
        getFeatureBySQLService.processAsync(getFeatureBySQLParams);

        function processCompleted(getFeaturesEventArgs) {
            var features, result = getFeaturesEventArgs.result;
            if (result && result.features) {
                features = result.features;
            }
            //计算每个featureid相同的点个数
            var court = [];
            court[0] = 0;
            var mm = 0;
            var kk = 0;
            var arr = []; //用来存储ID相同的要素;
            var featurearr = [];
            for (var i = 0; i < features.length; i++) {
                if (features[i].data.AREA == mm) {
                    court[kk] = court[kk] + 1;
                    arr.push(features[i]);
                }
                else {
                    featurearr.push(arr);
                    arr = [];
                    kk = kk + 1;
                    court[kk] = 1;
                    arr.push(features[i]);
                    mm = mm + 1;
                }
                if (court[27] == 11) {
                    featurearr.push(arr);
                }
            }
            //遍历每个区域
            changeTime(time);
            vectorLayer.removeAllFeatures();
            var pointFeatures = [];
            //循环遍历区域
            for (var j = 0; j < court.length; j++) {
                var area = featurearr[j];
                var population = 0;
                for (var z = 0; z < area.length; z++) {
                    if ((area[z].attributes.MIGRATION == "true" && area[z].attributes.TIME >= time) || (area[z].attributes.MIGRATION == "false" && area[z].attributes.TIME <= time)) {
                        population += Number(area[z].attributes.POPULATION);
                    }
                }
                var point = new SuperMap.Geometry.Point(area[0].geometry.x, area[0].geometry.y);
                var pointFeature = new SuperMap.Feature.Vector(point, {}, {
                    fillColor: "#ff8000",
                    fillOpacity: 0.8,
                    strokeOpacity: 0,
                    label: population + "",
                    fontColor: "#ffffff",
                    fontOpacity: "1",
                    fontFamily: "隶书",
                    fontSize: "1em",
                    pointRadius: Math.sqrt(population / 50)
                });
                pointFeatures.push(pointFeature);
            }
            vectorLayer.addFeatures(pointFeatures);
        }

        function processFailed(getFeaturesEventArgs) {
            widgets.alert.showAlert(getFeaturesEventArgs.error.errorMsg, false);
        }
    }

    function changeTime(time) {
        if (time >= 0 && time < 1) {
            document.getElementById("timeDate").innerHTML = resources.text_24;
        }
        else if (time >= 1 && time < 2) {
            document.getElementById("timeDate").innerHTML = resources.text_25;
        }
        else if (time >= 1 && time < 3) {
            document.getElementById("timeDate").innerHTML = resources.text_26;
        }
        else if (time >= 1 && time < 4) {
            document.getElementById("timeDate").innerHTML = resources.text_27;
        }
        else if (time >= 1 && time < 5) {
            document.getElementById("timeDate").innerHTML = resources.text_28;
        }
        else if (time >= 1 && time < 6) {
            document.getElementById("timeDate").innerHTML = resources.text_29;
        }
        else if (time >= 1 && time < 7) {
            document.getElementById("timeDate").innerHTML = resources.text_23;
        }
        document.getElementById("timeHour").innerHTML = parseInt((time - parseInt(time)) * 24) + resources.text_clock;
    }

    //添加迁徙数据
    function addMigrate() {
        var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;

        getFeatureParam = new SuperMap.REST.FilterParameter({
            name: "Migrate@DynamicData",
            attributeFilter: "SmID < 809"
        });
        getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
            queryParameter: getFeatureParam,
            datasetNames: ["DynamicData:Migrate"]
        });
        getFeatureBySQLParams.toIndex = 808;
        getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(url2, {
            eventListeners: {"processCompleted": processCompleted, "processFailed": processFailed}
        });

        getFeatureBySQLService.processAsync(getFeatureBySQLParams);
    }

    function processCompleted(getFeaturesEventArgs) {
        var features, result = getFeaturesEventArgs.result;
        if (result && result.features) {
            features = result.features;
        }
        var pointFeatures = [];
        //循环遍历区域
        for (var i = 0, len = features.length; i < len; i++) {
            var point = features[i].geometry;
            var pointFeature = new SuperMap.Feature.Vector(point, {
                FEATUREID: features[i].data.FEATUREID,
                TIME: features[i].data.TIME,
                POPULATION: features[i].data.POPULATION
            });
            pointFeatures.push(pointFeature);

        }
        animatorVector.addFeatures(pointFeatures);
    }

    function processFailed(getFeaturesEventArgs) {
        widgets.alert.showAlert(getFeaturesEventArgs.error.errorMsg, false);
    }

    //开始播放动画
    function startAnimator() {
        animatorVector.animator.start();
    }

    //暂停播放动画
    function pauseAnimator() {
        animatorVector.animator.pause();
    }

</script>
</body>
</html>


技术交流 省涯 QQ:2252224326 2252224326@qq.com 版权所有 http://blog.sina.com.cn/u/6029512413
原文地址:https://www.cnblogs.com/shengya/p/14961818.html