作者:马光佳
本次任务完成时间:2018.12.21-2019.1.19
开发工具与关键技术:MicrossftVisualStudio,GIS

一、登录界面
输入正确的登录名称和密码,点击登录方可进入主页面,输入错误的登录信息,有提示框提示错误

二、主页面
主页面显示地图,
完成的功能模块:图层管理、查询搜索、周边分析、工具箱(测距离、测面积、圆选、框选、自定义选、清除图层)

三、查询搜索
查询搜索可以进行模糊查询,也可以进行条件查询;
操作流程:
模糊查询=》在input文本里输入该地区的一个名称或者一个字,点击查询,查询出的结果会显示文本框下面被隐藏的盒子里,选择自己想要查询的地址,选中点击,该地址就会在地图上标记出来,并且弹出地址的详细信息,如下图所示:
条件查询=》在select下拉框里选择自己要查询的条件,点击查询,该条件信息的数据都会显示出来,然后再选中需要查询的地点,点就会在地图上标记出来,如图下:

四、周边分析
操作流程:
查询按钮:点击选择按钮可在地图上任意选择一个点作为周边查询的中心点数据,半径默认为20000米,可编辑,勾选需要查询的数据,点击更多>>显示更多的数据条件出来,勾选好需要查询的数据后,点击查询,地图会圈出一个半径为20000米的圆,圆里面会显示勾选中的数据信息标记,点击图标,弹出该地点的详细信息;
重置按钮:是重新选择中心点,并且清空上一次的操作数据;
清除按钮:是清除所有上一次的操作,并且无法再进行选择中心点;

五、图层管理
操作流程:
图层管理的数据是针对整个地图上的数据;
点击图层显示图层数据,勾选医院分布图,地图就会显示该地区的所有医院位置出来,点击图标显示详细信息,清除勾选,数据就在地图上消失;

六、测距离
点击该图标,可以在地图上任意选取点,选取最后一个点时,双击鼠标左键,方可出现下图的标示,每一个点显示的距离都是离起点的距离

七、测面积
点击侧面积按钮,在地图上选择三个以上的点进行操作,在最后一个点时,双击鼠标左键,将弹出面积的信息提示框;

八、圆选查询医务
点击圆选按钮,在地图上任意选择一个点按住鼠标左键往外拉,形成一个需要查询的面积圆后,松开鼠标即可查询到圆选内的医院数据信息,点击图标显示详细信息;点击清除按钮,就可以清除图层的所有数据;
九、框选查询村庄
点击框按钮,在地图上选择一个点,按住鼠标左键,往外拉,松开松开即可查询到框选的村庄数据,点击图表弹出详细地址信息
十、自定义选查询村庄
点击自定义按钮,在地图上选择三个以上的点进行操作,在最后一个点时,双击鼠标左键,将弹出选中面积的村庄数据,点击图标显示详细地址信息数据

十一、工具箱
点击工具箱按钮显示和隐藏其它图标,
工具箱可拖动,背景颜色还会无限循环的动画运动;鼠标放上去每个图标都会旋转360度,并且图标颜色也变化;

工具箱经典的代码:
结构的搭建:

<article id="article"><div class="title1" style="display:none " title="圆选医务站" onclick="drawGeometry1()" ><a class="jrerg tu"><i class="icon iconfont icon-zidingyi"></i></a>                       </div><div class="title2" style="display: none " title="测面积" onclick="areaMeasure()" ><a class="haubuin tu"><i class="icon iconfont icon-cemianji"></i></a></div><div class="title3" style="display:none " title="测距" onclick="distanceMeasure()"><a class="jrerg1 tu"><i class="icon iconfont icon-ceju"></i></a></div><div class="title4" style="display:none "title="框选" onclick="drawGeometry5()"><a class="zaikai1 tu"><i class="icon iconfont icon-zidingyi2"></i></a></div><div class="title5" style="display:none" title="自定义框选村庄" onclick="drawGeometry2()"><a id="haubuin1" class="haubuin1 tu"><i class="icon iconfont icon-zidingyi1"></i></a></div><div class="title6" style="display:none" title="清除" onclick="clearFeatures()"><a class="zaikai tu"><i class="icon iconfont icon-qingchu3"></i></a></div><div class="zongheanniu" title="工具箱"><a class="dibu1 tu"><i class="icon iconfont icon-zonghe2"></i></a></div></article>

背景动画变化的css样式:

 #article .title1,#article .title2,#article .title3,#article .title4,#article .title5,#article .title6 {height: 60px;width: 60px;border-radius: 50%;-webkit-transition: -webkit-transform 2s ease-out;-moz-transition: -moz-transform 2s ease-out;-o-transition: -o-transform 2s ease-out;            border-bottom: 1px solid rgba(0, 0, 0, 0.05);text-align: center;background: linear-gradient(45deg,rgba(111, 199, 181, 0.72) 0%,rgba(19, 189, 206, 0.72), 20%,rgba(0, 148, 217, 0.72) 40%, rgba(90, 54, 148, 0.72) 60%, rgba(238, 77, 116, 0.72) 80%, rgba(245, 140, 88, 0.72) 100%);background-size: 400%;background-position: 0% 100%;animation: gradient 7.5s ease-in-out infinite;
}@keyframes gradient {0% {background-position: 0% 100%;}50% {background-position: 100% 0%;}100% {background-position: 0% 100%;}
}

十二、项目开发总结
学习GIS课程一个星期,老师就叫我们自己研发GIS项目,说真的,我一脸懵逼,无从下手;
第一阶段:我用了一个星期去搭建项目的页面,然后不知道做什么了,看到很多人都完成不少的功能模块,瞬间压力来了;
第二阶段:逐渐去看代码,找思路,询问同学的帮助;大概用了四天,有逐渐想放弃的想法;
第三阶段:领悟成功,静心思考完成了工具箱的所有功能;
第四阶段:又卡在查询搜索功能模块,用了两天时间思考,完成了查询搜索功能,从放弃过无数次,但还是学下去;
第五阶段:一样卡在周边分析功能模块,不放弃的精神,用了一个星期完成周边分析的功能模块;
GIS项目的研发让我悟懂了一个道理:“只要坚持去做,就一定会做出来”,从一开始的一脸懵逼到现在能完成多个功能的我;虽然代码很多都不了解是什么意思,但只要自己坚持去研究,总是会能明白一些关键所在的;不管是做项目还是课后练习,我觉得我们同学之间需要多交流,一个人的研究是比不上多人的研究,只有交流,我们才会领悟得更加快;实施个人开放,那么你离成功将不远了;

佛山南海地区GIS项目相关推荐

  1. SuperMap GIS二次开发MVC实战训练-佛山顺德慢性病GIS项目总结

    SuperMap GIS二次开发MVC实战训练-佛山顺德慢性病GIS项目总结 作者:谢景 任务完成时间:2018年12月24日-2019年1月15日 完成模块功能:区域定位.查询搜索.路径分析.周边分 ...

  2. 佛山市南海技师学校计算机类,佛山南海信息技术学校2021年有哪些专业

    即将面临毕业的时候,同学们都要选择学校,都要选择专业就读,至于选择什么,就是一大难题了.学习是重要的事情,选择更是件大事.小编整理了学校的招生专业详情,仅供参考. 佛山南海信息技术学校专业名单:开设了 ...

  3. 佛山市南海技师学校计算机类,2019年佛山南海信息技术学校招生录取分数线

    佛山南海信息技术学校2019年录取分数线暂未公布,预计在2019年6月份公布.以往数据表明中职学校在划定录取分数线时,通常以考生当地普高招生分数线为基准分数线,考生可参考2018年广东地区普高及普通高 ...

  4. 佛山市南海技师学校计算机类,佛山南海信息技术学校2019年招生录取分数线

    佛山南海信息技术学校2019年录取分数线暂未公布,预计在2019年6月份公布.以往数据表明中职学校在划定录取分数线时,通常以考生当地普高招生分数线为基准分数线,考生可参考2018年广东地区普高及普通高 ...

  5. 佛山市南海技师学校计算机类,佛山南海信息技术学校有哪些专业

    很多考生在选择学校时,对学校信息缺乏对专业又不了解,不少家长和考生都会问佛山南海信息技术学校有哪些专业?综合考量意向学校,从而选出最适宜孩子学习成长的学校.下面是小编整理佛山南海信息技术学校的一些资料 ...

  6. GIS项目中数据开源、工具开源、开发开源的解决方案

    GIS项目中数据开源.工具开源.开发开源的解决方案 参考文章: (1)GIS项目中数据开源.工具开源.开发开源的解决方案 (2)https://www.cnblogs.com/naaoveGIS/p/ ...

  7. 佛山南海西樵镇江滨花园大三房看房日记

    您好,我是佛山南海西樵镇江滨花园的业主,由于想回老家养老,急需卖房,具体情况如下: 普通70年住宅,带西樵二小等学位(没有占用过),房子是满二唯一,建筑面积116平,套内108平,实用面积大,三房两厅 ...

  8. java gis项目_记录:GIS常用开发工具

    一.GIS软件 ArcGIS Erdas Envi QGIS:开源 国产:超图.中地MapGIS 二.二次开发编程语言 页面前端:html.css.JavaScript .JQuery.Bootstr ...

  9. 2023浙沪地区MEM项目提前批面试申请最后时间表(8-11月)

           进入到8月份,工程管理硕士的提前批面试申请也将迎来高峰期,对于浙江省的考生来说,本省的MEM项目自然为多数考生的首选,目前除了浙大之外,工大.杭电.财大也陆续开启了MEM项目的招生,但目 ...

最新文章

  1. atitit.php中的dwr 设计模式
  2. 上海名校CS专业第一本科生:我5天里打工3天,丝毫不影响GPA,可见「教学」有多荒谬...
  3. Android系统Recovery工作原理之使用update.zip升级过程分析(五)
  4. Linux日志系统-05:案例1-实现临时日志文件滚动分割
  5. ML之ME/LF:机器学习中的模型评估指标/损失函数(连续型/离散型)的简介、损失函数/代价函数/目标函数之间区别、案例应用之详细攻略
  6. 获取keras中间层输出、模型保存与加载
  7. 关于 angularjs 的小结
  8. 【安装教程】windows8.1 下安装ubuntu14.04 双系统
  9. [linux/ unix] 查看占用端口的 进程ID 的区别
  10. ORM框架,sqlsugar学习一
  11. 38.线程交换与线程移动
  12. 2021Java面试总结!平安银行java开发面试
  13. 我裂开了,教给他如何搭建和使用代理服务器,他居然用来做这么不正经的事(爬虫,代理ip)
  14. “万米网格管理法”助力省城城市管理
  15. be 动词 、 一般动词的过去式
  16. 数独游戏-安卓版源代码和分析。
  17. win10每次开机桌面计算机就没有,怎样解决Win10开机需要按F1才能进入桌面
  18. [生存志] 第60节 论语章节概览
  19. JSD-2204-API-JavaIO-Day02
  20. mysql创建外键级联更新_MySQL使用外键实现级联删除与更新的方法

热门文章

  1. 前端对接微信公众号网页开发流程,JSSDK使用
  2. python1.常见基础数据结构
  3. 已通过港交所聆讯的巨子生物,凭何成为投资人眼中的一流生意?
  4. 医药健康API开放接口
  5. 计算机数控机床用英语怎么说,数控机床专业英语翻译.doc
  6. 华文慕课北大计算机组成原理陆俊林第五章课后习题解析
  7. 6-5 实验5_6_设计函数mypow (100分)
  8. 8串口服务器芯片,串口服务器芯片
  9. 关于Idea上面Resin部署的问题
  10. 开源一个golang小程序商城后台系统(moshopserver)