《海珠区慢性病防治系统——“综合展示”模块》项目研发总结

奈何桥边独自把头回

已于 2023-03-13 10:34:33 修改

阅读量416

点赞数

分类专栏：项目总结文章标签： javascript 开发语言 ecmascript

于 2019-01-17 10:18:51 首次发布

本文链接：https://blog.csdn.net/qq_44540139/article/details/86519147

版权

项目总结专栏收录该内容

2 篇文章 1 订阅

订阅专栏

作者：奈何丶一梦
本次任务完成时间：2018年12月30日～2019年1月16日
开发工具与关键技术：C#、.Net、javaScript、SuperMap iClient、SQL
完成模块功能：区域定位、查询搜索、路径查询、周边分析、工具箱、图层管理器
一、功能实现

区域定位主要包括定位点标记、点击标记冒泡的功能模块。
区域定位：见图1，是区域定位模块实现界面。
```
                                                图1
```

点击图1“红色标记图标”弹出所选街道的名称如图2，
在这里插入图片描述

             图2

查询搜索主要包括地址查询、公司企业查询、病例门诊号查询、卡片编号查询、项目登记号查询
地址查询：见图3，填写所需查询的地址点击查询按钮得到查询结果

在这里插入图片描述

                                                   图 3

点击查询结果列表的地址可以定位到所查询地址在地图中显示的位置，点击地图上的标记可弹出地址的详细地址，见图4：
在这里插入图片描述

											       图 4

公司企业查询、病例门诊号查询、卡片编号查询、项目登记号查询：请参考 “地址查询” 操作一致。

路径查询：主要包括“年查询”，“月查询”，“日查询”功能模块。
年查询：选择开始年份，结束年份为空时默认为当前年份，点击查询按钮即可查询出当前时间段的路径热点网格图，并显示查询结果，见图5
```
													图5
```

点击查询结果列表回填登记号并查询，见图6
在这里插入图片描述

														图6

当图层地图放大到设置的等级后热点网格图会分散为点数据，点击点可查看当前点的详细信息，见图7
在这里插入图片描述

														图7

月查询：请参考 “年查询” 操作一致。
日查询：选择开始日期，结束日期为空时默认为当前年份，点击查询按钮即可查询出当前时间段的路线，，并显示查询结果，见图8
在这里插入图片描述

														图8

点击查询结果列表回填登记号并查询，见图9
在这里插入图片描述

												图 9

鼠标移动到线数据与点数据时显示其详细信息，见图10，图11
在这里插入图片描述

												图10

在这里插入图片描述

												图11

周边分析：以圆形区域查询，可在地图中任意添加并获取中心点（见图12）或在图层管理器中的一些图层的点数据中点击周边查询获取中心点（见图20），并选择查询目标即可查询，见图13
```
												图12
```

在这里插入图片描述

											图13

点击查询结果列表可查看数据的详细信息，见图14

在这里插入图片描述

												图14

工具箱：主要以距离测量、面积测量、方框区域查询、圆形区域查询、自定义区域查询
距离测量：点击打开工具箱，点击距离测量图标，激活画线控件即可用鼠标在地图画线，除起点外每增加一个点就弹出当前点到起点的距离双击鼠标结束测量并关闭控件，见图15
```
										图15
```

面积测量：点击打开工具箱，点击距离面积图标，激活画几何图形控件，即可在地图上画多边形，双击鼠标即可弹出测量结果并关闭画几何图形控件，见图16
在这里插入图片描述

												图16

方框区域查询：点击打开工具箱，点击方框查询图标，激活画方框图形控件，点击地图拖动鼠标即可画出方框，松开鼠标即可查询方框内的医院与药店点数据，点击查询结果即可查看该点的详细信息。见图17
在这里插入图片描述

												图17

圆形区域查询：点击打开工具箱，点击圆形区域查询图标，激活画圆形图形控件，点击地图拖动鼠标即可画出圆形，松开鼠标即可查询圆形内的医院与药店点数据，点击查询结果即可查看该点的详细信息。见图18
在这里插入图片描述

											图18

自定义区域查询：点击打开工具箱，点击自定义区域查询图标，激活画多边形图形控件，点击地图即可增加点然后双击即可画出多边形并查询多边形内的医院与药店点数据，点击查询结果即可查看该点的详细信息。见图19
在这里插入图片描述

												图19

图层管理器：主要包括医院分布图层、社康分布图层、药店分布图层、病例分布散点图层、病例分布热力图层、病原基因分布图层
医院分布图层（见图20）：鼠标移动到点上显示医院名称和详细地址，还有周边查询按钮，点击周边查询按钮回填中心点到周边分析中兴点输入框，周边分析具体参考周边分析功能。
```
												图20
```

社康分布图层（见图21）：具体操作参照医院分布图层
在这里插入图片描述

											图21

药店分布图层（见图22）：具体操作参照医院分布图层
在这里插入图片描述

												图22

病例图例散点图：由病例当前所在住址在地图上所在位置的点，病例类型不同所在点样式也不同，与病例类型图例组成（见图23），点击病例点数据可查看病人的详细信息，具有周边分析与路径查询功能，点击周边分析回填中心点到周边分析中心点输入框，具体操作参考“周边分析”，点击路径查询回填项目登记号到路径查询项目登记号输入框，路径查询具体操作请参考“路径查询”。
在这里插入图片描述

												图23

病例分布热力图（见图24）：由不同权重显示不同颜色的热力点，与热点图例组成。
在这里插入图片描述

											图24

病原基因分布图（见图25）：由病原当前所在住址在地图上所在位置的点，病原基因类型不同所在点样式也不同，与病原基因类型图例组成，点击病原点数据可查看病人的详细信息，具有周边分析与路径查询功能，点击周边分析回填中心点到周边分析中心点输入框，具体操作参考“周边分析”，点击路径查询回填项目登记号到路径查询项目登记号输入框，路径查询具体操作请参考“路径查询”。
在这里插入图片描述

											图25

二、相关业务表和关系

在这里插入图片描述
三、经典代码
图层管理器限制显示图层量

 //图层信息发生改变时的监听事件
map.events.register("changelayer", undefined, listener);
//图层管理器限制显示图层量
        function listener(data) {
            var name = data.layer.name;//获取改变图层的名称
            var visibility = data.layer.visibility;//获取当前改变图层是显示的还是隐藏的
            var allMapStorey = ["医院分布图", "社康分布图", "药店分布图", "病例分布散点图", "病例分布热力图", "病原基因分布图"];//限制显示的图层名称的数组
            if (visibility == true) {//当前改变图层为显示的时候
                for (var i = 0; i < allMapStorey.length; i++) {//循环图层名称数组
                    if (name != allMapStorey[i]) {//当前图层名称不等于当前数组图层名称时
                        var mapStorey = map.getLayersByName(allMapStorey[i]);//利用当前数组图层名称找到当前数组名称图层
                        mapStorey[0].setVisibility(false);//隐藏当前数组名称图层
                    }
                }
            } 
        }

筛选并去除重复数据

var rNum = {}, eData = {}, rNumArr = [], eDataArr = [];//去重复分别表示项目登记号对象.活动时间对象.项目登记号数组.活动时间数组
for (var i = 0; i < selectData.length; i++) {//循环从系统数据库查询的数据
    var RegisterNumber = selectData[i].RegisterNumber;//项目登记号
    var ExerciseDate = selectData[i].ExerciseDate;//活动时间
    if (!rNum[RegisterNumber]) {//项目登记号对象中当前项目登记号不为true
        rNumArr.push(RegisterNumber);//项目登记号写入项目登记号数组
        rNum[RegisterNumber] = true;//项目登记号对象中当前项目登记号赋值为true
    }
    if (!eData[ExerciseDate] == true) {//活动时间对象中当前活动时间不为true
        eDataArr.push(ExerciseDate);//活动时间写入活动时间数组
        eData[ExerciseDate] = true;//活动时间对象中当前活动时间赋值为true

    }
}

四、开发总结

	该项目使我认识了GIS系统的多种图层有：
SuperMap.Layer.TiledDynamicRESTLayer分块动态 REST 图层（发布地图服务后浏览器显示的图层）、	
SuperMap.Layer.Markers 标记图层、
SuperMap.Layer.Vector渲染矢量要素的图层（可以渲染点、线、圆形、矩形、多边形等数据）、
SuperMap.Layer.HeatGridLayer热点格网图层（是以特殊的方式渲染点数据）、
SuperMap.Layer.HeatMapLayer（是以特殊的方式渲染点数据）热点图层、
SuperMap.Layer.Elements Elements图层（本质是一个div可以书写HTML）。
	
	各种控件：
SuperMap.Control.Navigation此控件处理伴随鼠标事件（拖拽，双击、鼠标滚轮缩放）的地图浏览，是一个地图默认添加的控件、
SuperMap.Control.MousePosition该控件显示鼠标移动时，所在点的地理坐标、
SuperMap.Control.LayerSwitcher图层选择控件（图层管理器）、
SuperMap.Control.SelectFeature要素选择控件（可以获取各种要素的属性值，如点要素的经纬度，矩形要素的范围，几何图形的范围等）、
SuperMap.Control.DrawFeature绘制要素控件配合SuperMap.Handler（用于处理Control事件的事件处理器）可绘制点、线、矩形、圆、多边形。

	SQL查询：配合使用
SuperMap.REST.FilterParameter过滤条件、
SuperMap.REST.QueryBySQLParameters查询参数、
SuperMap.REST.QueryBySQLService查询服务、
可以查询到各图层的点、线、面数据。

	面积与距离的测量：配和使用
SuperMap.REST.MeasureParameters量算参数、
SuperMap.REST.MeasureService量算服务、
可以测量距离与面积。

	范围查询：配合使用
SuperMap.REST.FilterParameter过滤条件、
SuperMap.REST.QueryByBoundsParameters范围查询参数、
SuperMap.REST.QueryByBoundsService查询范围服务，
可以查询出矩形范围内的数据。

	几何图形范围查询：配合使用
SuperMap.REST.FilterParameter过滤条件、
SuperMap.REST.QueryByGeometryParameters几何图形范围查询参数
SuperMap.REST.QueryByGeometryService几何图形查询服务，
可以查询出几何图形范围内的数据。

	地图弹窗：
SuperMap.Popup配置参数后可以在地图上任意点上设置弹窗，弹窗内可以书写HTML代码。