第一章: webGIS开发概述
一. 开发概述
1 核心概念
在GIS开发中, 最核心的概念有两个
●地图
●数据
数据中包括一些基本的要素(Feature)
●点
●线
●面(区)
●体
一句话总结
GIS开发, 就是在地图上某一个坐标点上显示对应的要素
2 整体流程
首先要加载地图做为底图, 底图比较常见的有瓦片, 地图文档 , 天地图
因此, 开发的第一步是能够通过web加载底图
不同的要素需要不同的图层承载, 而图层是附着在底图上, 和底图配合.
因此, 开发的第二步是图层操作
在每个图层上有不同的要素, 在图层的基础上进一步对要素进行操作
因此, 开发的第三步是要素操作
总结
1加载底图
2图层操作
3要素操作
二. 产品介绍
1 产品体系
2 开发流程
对于webGIS的二次开发, 主要是分为三步
1)数据处理
在MapGIS客户端进行数据处理
●瓦片裁剪
●生成失量地图
●生成地图文档
●添加各种要素, 编辑要素的属性
2)数据发布
通过server manger将数据上传到IG Server
●发布瓦片
●发布失量地图
●发布地图文档
3)数据显示
在web端, 通过JavaScript SDK调用接口对接IG Server, 进行地图和数据的可视化操作
架构分析
流程分析
3 Javascript SDK
可以理解为GIS Server的web客户端
原生的web客户端有4个著名的开源库, 其中广泛使用的主要是下面两个
●Cesuim: 主要处理3D渲染
●OpenLayers: 主要处理2D渲染
1) 什么是SDK
4种不同的开源框架有各自独立的API, 为了统一, 中地数码上开源框架基础上进行再次封装, 提供更方便好用的接口, 简化开发
2) 学什么
在我们本次培训中, 主要以OpenLayer为例给大家讲解
3) 具体内容
1地图服务
○加载各种地图(瓦片, 失量地图, 地图文档, 第三方地图[天地图]…)
○地图常用控件(放大, 缩小, 比例尺, 鹰眼…)
2目录服务
○图层与目录树(控制图层的显示与隐藏)
3要素服务
○各种要素(点, 线, 面)的操作
4分析服务
○空间分析, 拓扑分析…
三. 环境准备
1 安装配置IGServer
一、登录官网
http://www.smaryun.com/
1、完成注册和登录
2、在个人中心完成邮箱和手机号的验证
二、下载IG Server
http://www.smaryun.com/dev/download_detail.html#/download689
下载MapGIS IGServer开发包, 并安装
三、升级成开发者
http://www.smaryun.com/dev/
四. 安装IGServer
下载MapGIS IGServer开发包, 并安装
右键, 使用管理员运行
如果被阻止, 展开, 选择”仍要运行”
注意
1关闭所有的杀毒软件(360, qq管家)
2windows自带的保护程序, 点击仍要运行
选择”下一步”会提示安装缺少组件
选择路径(安装路径不要改变)
五、获取授权
授权码: http://www.smaryun.com/dev/dev_auth_detail.php
下载授权文件(这里我申请了高级授权, 基础开发授权也可以使用)
扫描下面这个二维码
安装key写入注册表
启动MapGIS IGServer服务
可以通过localhost:9999访问服务
点击帮助, 自动填入用户名/密码, 登录
可以通过web访问server manager页面
http://localhost:9999
六、解绑
http://www.smaryun.com/dev-space/#/dev-enviro/myauth
2 申请天地图Key
https://jingyan.baidu.com/article/9c69d48f6d1ab753c9024ecf.html
1 注册天地图用户
2 在天地图网站主页登录之后，点击右上角自己的用户名，然后点击右上角的开发资源按钮，如下图所示：
3 在开发资源页面，点击“控制台”，如下图所示：
4 点击“申请成为个人开发者”界面中的“去申请”，如下图所示：
5 勾选“同意天地图服务条款”，点击提交按钮，如下图所示：
6 出现申请成功提示对话框后，单击确定按钮，如下图所示：
7 点击“创建新应用”按钮，如下图所示：
8 填写相关信息，勾选“同意天地图服务条款”，点击提交按钮，如下图所示：
9 出现“创建应用成功”对话框后，单击确定按钮，如下图所示：
10 在应用管理列表中，红框部分的字符串即是之后需要使用的Key，如下图所示：
我这里申请的Key是: 11dce887d8c343629fe8efcf0c60caec
3 下载web SDK
http://develop.smaryun.com:8899/#/total/download
下载精简包
四. 主要参考文档
Openlayers示例: http://develop.smaryun.com:81/API/JS/OL5InterfaceDemo/index.htm
IGServer API文档: http://develop.smaryun.com:81/API/JS/IGS JavaScript API v02/index.htm
Openlayers文档: https://openlayers.org/en/latest/apidoc/
如果文章对你有帮助的话，也请你帮我2个忙吧 (*╹▽╹*)
给这篇文章一键三连吧，对我很重要啦~
关注一下我 @新中地职业培训学校，听说现在关注的，以后都是尊贵的老粉啦！
获取更多GIS开发相关课程资源V：gis0329