zoukankan      html  css  js  c++  java
  • 应急指挥中心系统的研究与设计

            通过GIS与虚拟仿真技术,对园区内企业生产设施、市政消防设施、公共管廊等进行三维建模,真实还原园区整体环境。以三维场景为依托,以智慧化工园区平台为核心,融合多个应用系统的数据,实现化工园区智能化管理。对园区内企业安全生产数据,环保监测,交通运输,车辆管理等数据进行综合展示,为园区管理部门对园区内突发事件的应急指挥,以及园区内环保监测管理,交通管理等提供强有力的信息保障。

      安全环保一张图

      以园区安全、环保、视频监控为主要内容,对园区企业信息、重大危险源监控数据、危险源报警信息、环保监测数据、视频监控等内容进行集中管理和展示。

      交通运输一张图

      以园区交通和物流信息为主要内容,对园区内危化品车辆实时定位和轨迹、电子运单信息、船舶定位和信息、园区车辆统计、园区企业危化品装车统计等内容进行集中展示。

    
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title data-i18n="resources.title_heatGridMapLayer"></title>
    <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>
    <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;
                 300px;
                text-align: center;
                z-index: 100;
                border-radius: 4px;
            }
        </style>
    </head>
    <body>
    <div id="map"></div>
    <script>
        var map, layer, heatGridLayer, selectGrid, infowin;
        //定义网格的styles
        var items = [
            {
                start: 0,
                end: 2,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#B8E4B8",
                    fillOpacity: 0.5
                }
            },
            {
                start: 2,
                end: 4,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#66dd66",
                    fillOpacity: 0.5
                }
            },
            {
                start: 4,
                end: 6,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#00ee00",
                    fillOpacity: 0.5
                }
            },
            {
                start: 6,
                end: 8,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#008800",
                    fillOpacity: 0.5
                }
            },
            {
                start: 8,
                end: 10,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#df8505",
                    fillOpacity: 0.5
                }
            },
            {
                start: 10,
                end: 12,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#CC9933",
                    fillOpacity: 0.5
                }
            },
            {
                start: 12,
                end: 16,
                style: {
                    strokeColor: "#C69944",
                    strokeWidth: 1,
                    fillColor: "#FF0000",
                    fillOpacity: 0.5
                }
            }
        ];
        var host = window.isLocal ? window.server : "https://iserver.supermap.io";
        var url = host + "/iserver/services/map-world/rest/maps/World";
        //初始化
        init();
    
        function init() {
            map = new SuperMap.Map("map", {
                controls: [
                    new SuperMap.Control.ScaleLine(),
                    new SuperMap.Control.Zoom(),
                    new SuperMap.Control.LayerSwitcher(),
                    new SuperMap.Control.Navigation({
                        dragPanOptions: {
                            enableKinetic: true
                        }
                    })]
            });
            map.addControl(new SuperMap.Control.MousePosition());
            layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
                transparent: true,
                cacheEnabled: true
            }, {maxResolution: "auto"});
            //创建热点网格图
            heatGridLayer = new SuperMap.Layer.HeatGridLayer("heatGrid");
            layer.events.on({"layerInitialized": addLayer});
        }
    
        //添加图层、注册事件、激活格网选择控件
        function addLayer() {
            map.addLayers([layer, heatGridLayer]);
            map.setCenter(new SuperMap.LonLat(0, 0), 0);
            // 创建格网选择控件
            var select = new SuperMap.Control.SelectGrid(heatGridLayer, {
                callbacks: {
                    //点击feature事件
                    clickFeature: function (f) {
                        closeInfoWin();
                        openInfoWin(f);
                    },
                    clickout: function () {
                        closeInfoWin();
                    }
                }
            });
            map.events.on({
                "movestart": function () {
                    closeInfoWin();
                }
            });
            map.addControl(select);
            select.activate();
            createHeatPoints();
        }
    
        //向服务器发送请求,获取数据
        function createHeatPoints() {
            var points = [new SuperMap.Geometry.Point(-180, 90),
                    new SuperMap.Geometry.Point(180, 90),
                    new SuperMap.Geometry.Point(180, -90),
                    new SuperMap.Geometry.Point(-180, -90)
                ],
                linearRings = new SuperMap.Geometry.LinearRing(points),
                region = new SuperMap.Geometry.Polygon([linearRings]);
            var queryParam, queryByGeometryParameters, queryService;
            //设置查询数据集的查询过滤参数
            queryParam = new SuperMap.REST.FilterParameter({name: "Capitals@World.1"});
            //设置 Geometry查询的相关参数
            queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({
                queryParams: [queryParam],
                geometry: region,
                spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT
            });
            queryService = new SuperMap.REST.QueryByGeometryService(url, {
                eventListeners: {
                    "processCompleted": processCompleted,
                    "processFailed": processFailed
                }
            });
            queryService.processAsync(queryByGeometryParameters);
    
    
        }
    
        function processCompleted(queryEventArgs) {
            var i, j, result = queryEventArgs.result;
            var heatFeatures = [];
            if (result && result.recordsets) {
                for (i = 0, recordsets = result.recordsets, len = recordsets.length; i < len; i++) {
                    if (recordsets[i].features) {
                        for (j = 0; j < recordsets[i].features.length; j++) {
                            var feature = recordsets[i].features[j];
                            var point = feature.geometry;
                            if (point.CLASS_NAME == SuperMap.Geometry.Point.prototype.CLASS_NAME) {
    
                                feature.attributes.temperature = parseInt(Math.random() * 45 * 10) / 10;
                                feature.style = {
                                    pointRadius: 4,
                                    graphic: true,
                                    externalGraphic: "images/country.png",
                                    graphicWidth: 6,
                                    graphicHeight: 6
                                };
                                heatFeatures.push(feature);
                            }
    
                        }
                    }
                }
            }
            //设置地图在第4级的时候进行格网散开
            heatGridLayer.spreadZoom = 4;
            heatGridLayer.items = items;
            //设置label显示的数据为字段temperature的内容
            heatGridLayer.dataField = "temperature";
            heatGridLayer.addFeatures(heatFeatures);
        }
    
        function processFailed(e) {
            widgets.alert.showAlert(e.error.errorMsg,false);
        }
    
        //弹出信息框
        function openInfoWin(feature) {
            var geo = feature.geometry;
            var bounds = geo.getBounds();
            var center = bounds.getCenterLonLat();
            var contentHTML = "<div style='font-size:.8em; opacity: 0.8; overflow-y:hidden;'>";
            contentHTML += "<div>" + "SmID:" + feature.data.SmID + "<br />" + resources.text_country + feature.data.COUNTRY + "<br />" + resources.text_capital + feature.data.CAPITAL + "</div></div>";
    
            var popup = new SuperMap.Popup.FramedCloud("popwin",
                new SuperMap.LonLat(center.lon, center.lat),
                null,
                contentHTML,
                null,
                true);
    
            feature.popup = popup;
            infowin = popup;
            map.addPopup(popup);
        }
    
        //关闭信息框
        function closeInfoWin() {
            if (infowin) {
                try {
                    infowin.hide();
                    infowin.destroy();
                }
                catch (e) {
                }
            }
        }
    
    </script>
    </body>
    </html>


    技术交流 省涯 QQ:2252224326 2252224326@qq.com 版权所有 http://blog.sina.com.cn/u/6029512413
  • 相关阅读:
    Delphi 之Copyrect的使用
    Delphi GDI对象之脱屏位图(Offscreen Bitmaps),也叫内存位图
    1067. Sort with Swap(0,*) (25)【贪心】——PAT (Advanced Level) Practise
    Server Tomcat v7.0 Server at localhost was unable to start within 45 seconds
    每一个JavaScript开发者都应该知道的10道面试题
    【HDOJ 5407】 CRB and Candies (大犇推导
    Wireshark默认不抓取本地包的解决方式
    Android LaunchMode案例篇
    使用ViewPager实现广告滑动效果
    剑指offer面试题26-复杂链表的复制
  • 原文地址:https://www.cnblogs.com/shengya/p/14931863.html
Copyright © 2011-2022 走看看