当前位置: 首页 > news >正文

webgis从基础到开发实践_WebGIS开发进阶练手题(二)

472e1208d318625d4c0d919a7fba4f61.png

编程学习需要多写,多做项目,没有做什么应用的想法的同学可以试试下边的几个应用,边学边练,你才会慢慢成长……

以下内容适合对象:

1、想在Webgis方向学习编程或者工作的学弟妹;

2、相关领域从业者或者教师;

3、有编程基础的,对编程感兴趣者;

如果觉得以下题目困难的请查找历史信息阅读《WebGIS开发入门练习题(一)》文章

一、简单的webgis系统

难度系数:★★★☆☆

(一)、功能点描述:

  1. 地图预览,图层切换;
  2. 具备距离测量,面积测量;
  3. 支持坐标定位,空间要素查询(点线面支持其一即可),属性查询+空间(绘图)查询;
  4. 支持点线面(其一)要素的新增、删除;

(二)、可能涉及的软件或者技术:

  • arcgis server做地图容器的话,需要安装arcgis、arcgis server;如果考虑自己做存储可能要arcsde+oracle(新手可能有点坑,可以不考虑上边功能4);
  • 以上功能实现可以使用的地图前端框架有arcgis api for JavaScript,或者openlayers2.x或者openlayers3.x
  • 做得简单一些可以不需要后台,全部是前端JavaScript+HTML+CSS静态代码,部署Tomcat或者IIS调试访问

二、个人旅游地图应用——路线篇

难度系数:★★★★★

(一)、功能点描述:

  1. 用户通过添加旅行起始站(火车或飞机),在地图上绘制起点和终点路线,相当于数据可视化;
  2. 可对路线进行描述,挂图片(挂火车票或者飞机票)等,点击路线或者起点终点可以展示行程车票;
  3. 打印,导出地图;可将展示结果生成效果图分享社区,如微信,微博,QQ等;
  4. 高级功能:
  • 用户定制:支持用户登录,用户可以自行对上边的功能操作,自定义行程统计图;可保存归档;
  • 支持保存:第二次进入可编辑更新;
  • 支持路线导入:指定导入的数据格式,导入后自动绘制或者直接生成效果图

【参考大致效果图:】

e99fbb1660dc1c9c003a8f3469797564.png

(二)、可能涉及技术:

1、地图方面,可以选择有 Mapbox、ArcGIS、OpenLayers、百度地图BMap、高德地图AMap、Google Map 等;看个人熟悉程度。

2、说明一下,上边给的效果图是 Echarts 地图可视化统计图,使用Echarts这种图表可视化库实现应该也是可以的,另外类似的 Highchart 的地图模块 highMaps 也可以了解一下,Echarts是中文的,另外 Echarts 官方结合了百度地图展示很多栗子,建议如果选择 ,选 Echarts 吧,开源免费+国产!

3、涉及后端框架和存储技术,建议是Java+MySQL,因为Java 语言是WebGIS在服务端用的最多的。当然,这只是学习练手的应用,编程语言不限制,重要的是过程+结果!有能力可能采用目前流行的 NodeJS+MongoDB 做后端服务和存储(那就是JavaScript统治前后端啦~哈哈)

4、功能页面上,就随意发挥了,原生 JavaScript + HTML 或者 用 AngularJS 这些都行吧,注意前端功能效果和体验第一位。

5、功能点4 里边的高级功能可以不考虑,给觉得此应用简单的同学参考。

三、个人旅游地图应用——相册篇

难度系数:★★★★★

类似应用二,只是路线改成了相册罢了。

我们都会去旅游,游山玩水的过程会拍照,智能机或者单反普遍的时代,相片里边都可以记录地理位置,这个位置信息有切确的拍照地点的经纬度坐标信息。所以,相片就能定位了……

之前简单的写过一个小demo:

GitHub - gis520/amap-photomap: 使用amap API实现相册在地图上定位展示demo,鼠标移动图片marker时放大展示

功能思路大致描述:

1、获取照片的经纬度信息后(如果程序实现不了,可以通过网上现有的工作或者软件提出照片的经纬度信息出来),支持图片上传,上传后保存图片的经纬度信息到数据库,已经图片上传服务器的相对路径。以便程序可以根据接口读取照片和位置信息,在地图上标注出来。

2、地图标注照片缩略图效果:地图缩放级别不同,展示不同密度的缩略图发布情况(截图来自IPhone相册的地图定位效果);

cf0e0f64e6c2268398fd640f3c7f6d2f.png

3、点击缩略图或者某个旅游地点,可以展示该区域的照片(相册),可以切换查看照片或者轮播的方式(可参考高德地图的实景图片功能)。

微信公众giscafer

WebGIS专栏教程:

WebGIS入门实战 - 小专栏​xiaozhuanlan.com
a1442e5a061feee6d6b6e1d591920dce.png

相关文章:

  • idea 启动vue 一会自己停了_这 几个 IDEA,调试的骚操作,用了都说爽!
  • java 桌面应用程序_针对初学Java的小伙伴,入门时应该了解的Java基础知识
  • python面向对象思路_Python基础之面向对象的软件开发思路
  • python主要应用于云计算的哪些方面_python在云计算的应用领域
  • python小程序_如何使用 Python 开发微信小程序
  • 华为平板wps语音朗读_年轻人智慧生活:荣耀笔记本、平板V6,智慧屏X1等多款新品再升级...
  • python复制文件夹所有文件到另外目录_如何使用Python将文件的整个目录复制到现有目录中?...
  • python输入多个数字 找出只出现一个的数字_【算法14】找出数组中两个只出现一次的数字...
  • python随机抽人小程序_python抽人程序初试
  • lodop打印不显示页码_教你9招,一次性解决Excel表格打印问题!
  • 原型和原型链的理解_理解Javascript的原型和原型链
  • 一个事务中 可以查询自己未提交的数据吗_来谈谈MySQL事务及事务引发的问题
  • python填写表单并提交_form表单提交方式
  • rar解压密码7秒破_30分钟,天猫成交额突破3723亿,京东9分钟破2000亿!姐妹们,你贡献了多少?...
  • python获取方法名_python获取当前运行函数名称的方法实例代码
  • [iOS]Core Data浅析一 -- 启用Core Data
  • “寒冬”下的金三银四跳槽季来了,帮你客观分析一下局面
  • Android 初级面试者拾遗(前台界面篇)之 Activity 和 Fragment
  • classpath对获取配置文件的影响
  • HTTP中GET与POST的区别 99%的错误认识
  • Javascript设计模式学习之Observer(观察者)模式
  • JS数组方法汇总
  • python docx文档转html页面
  • python大佬养成计划----difflib模块
  • supervisor 永不挂掉的进程 安装以及使用
  • vue总结
  • 闭包,sync使用细节
  • 从伪并行的 Python 多线程说起
  • 动态魔术使用DBMS_SQL
  • 警报:线上事故之CountDownLatch的威力
  • 前端临床手札——文件上传
  • 容器化应用: 在阿里云搭建多节点 Openshift 集群
  • 首页查询功能的一次实现过程
  • 腾讯大梁:DevOps最后一棒,有效构建海量运营的持续反馈能力
  • 学习笔记TF060:图像语音结合,看图说话
  • 优化 Vue 项目编译文件大小
  • 做一名精致的JavaScripter 01:JavaScript简介
  • 【云吞铺子】性能抖动剖析(二)
  • MyCAT水平分库
  • Redis4.x新特性 -- 萌萌的MEMORY DOCTOR
  • Unity3D - 异步加载游戏场景与异步加载游戏资源进度条 ...
  • 曾刷新两项世界纪录,腾讯优图人脸检测算法 DSFD 正式开源 ...
  • # centos7下FFmpeg环境部署记录
  • #laravel 通过手动安装依赖PHPExcel#
  • #NOIP 2014# day.1 生活大爆炸版 石头剪刀布
  • (第二周)效能测试
  • (考研湖科大教书匠计算机网络)第一章概述-第五节1:计算机网络体系结构之分层思想和举例
  • (五)c52学习之旅-静态数码管
  • (轉貼) 2008 Altera 亞洲創新大賽 台灣學生成果傲視全球 [照片花絮] (SOC) (News)
  • .locked1、locked勒索病毒解密方法|勒索病毒解决|勒索病毒恢复|数据库修复
  • .NET Core WebAPI中封装Swagger配置
  • .NET/MSBuild 中的发布路径在哪里呢?如何在扩展编译的时候修改发布路径中的文件呢?
  • .NET6使用MiniExcel根据数据源横向导出头部标题及数据
  • .NET平台开源项目速览(15)文档数据库RavenDB-介绍与初体验
  • /usr/bin/env: node: No such file or directory