1. 引言

MapGIS IGServer 是中地数码的一款跨平台GIS 服务器产品,提供了空间数据管理、分析、可视化及共享服务

MapGIS IGServer的下载(试用)地址:MapGIS IGServer Java for Windows (smaryun.com)

MapGIS IGServer 的 JavaScript API 文档:[IGS JavaScript API (smaryun.com)](http://develop.smaryun.com:81/API/JS/IGS JavaScript API v02/index.htm)

MapGIS IGServe与OpenLayers的集成示例:OpenLayers5示例 (smaryun.com)

官方示例的说明很详细,本文结合官方示例与API文档,基于OpenLayers和IGServer实现Web地图要素的空间分析

2. 环境搭建

笔者这里使用的是Java版的IGServer,版本号为10.6,详细的安装、试用步骤参考官网:

笔者这里使用的OpenLayers是MapGIS集成的MapGIS Client for JavaScript中的OpenLayers部分,其调用方式参考:

笔者这里直接使用CDN引入:

<script src="http://develop.smaryun.com/static/libs/include-openlayers-local.js"></script>

另外,还需要IGServer发布一个要素地图服务,用以进行要素的增删改查,笔者这里使用MapGIS官方发布MapGIS地图文档(有时数据可能不可用)

3. 地图加载

构建基础的HTML页面,使用OpenLayers加载底图,并使用中地数码的扩展包加载GDBP图层(GdbpLayer)

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://develop.smaryun.com/static/libs/include-openlayers-local.js"></script>
<style>
html,
body,
#map {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
</head> <body>
<div id="map"></div> <script>
const map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
name: "高德底图",
source: new ol.source.XYZ({
url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}'
})
})
],
view: new ol.View({
center: [120.9, 28.9],
zoom: 4,
projection: 'EPSG:4326'
})
}) const gdbpLayer = new Zondy.Map.GdbpLayer("长江黄河",
["gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1"], {
ip: "develop.smaryun.com",
port: "6163" //访问IGServer的端口号,.net版为6163,Java版为8089
});
map.addLayer(gdbpLayer)
</script>
</body> </html>

加载的结果图如下:

4. 缓冲区分析

参考官方的参考示例:类缓冲分析

类缓存分析的流程为:

  • 初始化图层单圈缓冲分析服务Zondy.Service.ClassBufferBySingleRing或图层多圈缓冲区分析服务Zondy.Service.ClassBufferByMultiplyRing,设置缓冲分析必要参数(对象中的属性来自本类公共属性和Zondy.Service.ClassBufferBase类的公共属性)
  • 调用图层缓冲区分析服务的execute方法完成图层单圈缓冲分析或者图层多圈缓冲分析功能

核心代码如下:

// 单圈缓冲区分析
let resultname = ''
function singleBuffAnalysis() {
resultname =
'gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1' + Date.now()
//实例化ClassBufferBySingleRing类
var clsBufBySR = new Zondy.Service.ClassBufferBySingleRing({
ip: 'develop.smaryun.com',
port: '6163', //访问IGServer的端口号,.net版为6163,Java版为8089,
//缓冲时要素左侧缓冲半径
leftRad: 0.5,
//缓冲时要素右侧缓冲半径
rightRad: 0.5,
//不允许根据属性字段设置缓冲区半径
isByAtt: false,
})
//调用Zondy.Service.ClassBufferBase基类公共属性
clsBufBySR.srcInfo = 'gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1'
clsBufBySR.desInfo = resultname
//调用基类Zondy.Service.AnalysisBase的execute方法执行类缓冲分析,AnalysisSuccess为回调函数
clsBufBySR.execute(
AnalysisSuccess,
'post',
false,
'json',
AnalysisError
)
}

完整代码如下:

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://develop.smaryun.com/static/libs/include-openlayers-local.js"></script>
<style>
html,
body,
#map {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
</head> <body>
<button onclick="singleBuffAnalysis()">缓冲区分析</button>
<div id="map"></div> <script>
const map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
name: "高德底图",
source: new ol.source.XYZ({
url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}'
})
})
],
view: new ol.View({
center: [120.9, 28.9],
zoom: 4,
projection: 'EPSG:4326'
})
}) const gdbpLayer = new Zondy.Map.GdbpLayer("长江黄河",
["gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1"], {
ip: "develop.smaryun.com",
port: "6163" //访问IGServer的端口号,.net版为6163,Java版为8089
});
map.addLayer(gdbpLayer) // 单圈缓冲区分析
let resultname = ''
function singleBuffAnalysis() {
resultname =
'gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1' + Date.now()
//实例化ClassBufferBySingleRing类
var clsBufBySR = new Zondy.Service.ClassBufferBySingleRing({
ip: 'develop.smaryun.com',
port: '6163', //访问IGServer的端口号,.net版为6163,Java版为8089,
//缓冲时要素左侧缓冲半径
leftRad: 0.5,
//缓冲时要素右侧缓冲半径
rightRad: 0.5,
//不允许根据属性字段设置缓冲区半径
isByAtt: false,
})
//调用Zondy.Service.ClassBufferBase基类公共属性
clsBufBySR.srcInfo = 'gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流_1'
clsBufBySR.desInfo = resultname
//调用基类Zondy.Service.AnalysisBase的execute方法执行类缓冲分析,AnalysisSuccess为回调函数
clsBufBySR.execute(
AnalysisSuccess,
'post',
false,
'json',
AnalysisError
)
} //分析失败回调
function AnalysisError(e) {
alert(e)
} //分析成功后的回调
function AnalysisSuccess(data) {
console.log(data)
if (data.succeed) {
const resultLayer = new Zondy.Map.GdbpLayer('', [resultname], {
ip: 'develop.smaryun.com',
port: '6163', //访问IGServer的端口号,.net版为6163,Java版为8089,
})
map.addLayer(resultLayer)
}
}
</script>
</body> </html>

结果图如下:

5. 叠加分析

参考官方的参考示例:图层叠加分析

类缓存分析的流程为:

  • 初始化图层叠加分析服务Zondy.Service.OverlayByLayer或多边形叠加分析服务Zondy.Service.OverlayByPolygon,设置叠加分析必要参数(对象中的属性来自本类公共属性和Zondy.Service.OverlayBase类的公共属性)
  • 调用叠加分析服务的execute方法完成图层叠加分析或者多边形叠加分析功能

核心代码如下:

// 图层叠加分析分析
let resultname = ''
function overlayByLayer() {
//实例化OverlayByLayer类
resultname = "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/overLayByLayer" + Date.now();
//实例化OverlayByLayer类
var overlayParam = new Zondy.Service.OverlayByLayer({
ip: "develop.smaryun.com",
port: "6163", //访问IGServer的端口号,.net版为6163,Java版为8089,
//设置被叠加图层URL
srcInfo1: "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流",
//设置叠加图层URL
srcInfo2: "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界政区",
//设置结果URL
desInfo: resultname,
//设置结果图层的图形参数信息
infoOptType: 2,
//求交
overType: 1,
//允许重算面积
isReCalculate: true,
//容差半径
radius: 0.05
});
//调用基类的execute方法,执行叠加分析, onSuccess为结果回调函数
overlayParam.execute(AnalysisSuccess, "post", false, "json", AnalysisError);
}

完整代码如下:

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://develop.smaryun.com/static/libs/include-openlayers-local.js"></script>
<style>
html,
body,
#map {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
</head> <body>
<button onclick="overlayByLayer()">叠加分析</button>
<div id="map"></div> <script>
const map = new ol.Map({
target: 'map',
layers: [],
view: new ol.View({
center: [120.9, 28.9],
zoom: 4,
projection: 'EPSG:4326'
})
}) const gdbpLayer = new Zondy.Map.GdbpLayer("",
["gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界政区"], {
ip: "develop.smaryun.com",
port: "6163" //访问IGServer的端口号,.net版为6163,Java版为8089
});
map.addLayer(gdbpLayer)
const gdbpLayer2 = new Zondy.Map.GdbpLayer("",
["gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流"], {
ip: "develop.smaryun.com",
port: "6163" //访问IGServer的端口号,.net版为6163,Java版为8089
});
// map.addLayer(gdbpLayer2) // 图层叠加分析分析
let resultname = ''
function overlayByLayer() {
//实例化OverlayByLayer类
resultname = "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/overLayByLayer" + Date.now();
//实例化OverlayByLayer类
var overlayParam = new Zondy.Service.OverlayByLayer({
ip: "develop.smaryun.com",
port: "6163", //访问IGServer的端口号,.net版为6163,Java版为8089,
//设置被叠加图层URL
srcInfo1: "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界河流",
//设置叠加图层URL
srcInfo2: "gdbp://MapGisLocal/OpenLayerVecterMap/ds/世界地图经纬度/sfcls/世界政区",
//设置结果URL
desInfo: resultname,
//设置结果图层的图形参数信息
infoOptType: 2,
//求交
overType: 1,
//允许重算面积
isReCalculate: true,
//容差半径
radius: 0.05
});
//调用基类的execute方法,执行叠加分析, onSuccess为结果回调函数
overlayParam.execute(AnalysisSuccess, "post", false, "json", AnalysisError);
} //分析失败回调
function AnalysisError(e) {
alert(e)
} //分析成功后的回调
function AnalysisSuccess(data) {
console.log(data)
if (data.succeed) {
const resultLayer = new Zondy.Map.GdbpLayer('', [resultname], {
ip: 'develop.smaryun.com',
port: '6163', //访问IGServer的端口号,.net版为6163,Java版为8089,
})
map.addLayer(resultLayer)
}
}
</script>
</body> </html>

结果如下图:

6. 其他分析

更多空间分析如,网络分析、拓扑分析、裁剪分析等参考官方API手册和示例:、

7. 参考资料

[1]OpenLayers5示例 (smaryun.com)

[2][IGS JavaScript API (smaryun.com)](http://develop.smaryun.com:81/API/JS/IGS JavaScript API v02/index.htm)

基于IGServer的Web地图要素空间分析的更多相关文章

  1. 基于GIS空间分析的多边形提取技术

    现有基于矢量图形的骨架线提取方法主要包括数据预处理.基于约束 Delauny 三角剖分的骨架线结点生成和骨架线的连接 3 个过程,上述过程都可利用现有 GIS 系统的数据处理.空间分析和建模功能实现. ...

  2. 【转】阿里巴巴技术专家杨晓明:基于Hadoop技术进行地理空间分析

    转自:http://www.csdn.net/article/2015-01-23/2823687-geographic-space-base-Hadoop [编者按]交通领域正产生着海量的车辆位置点 ...

  3. GIS空间分析案例教程——带背景和周围要素的逐要素导出地理

    GIS空间分析案例教程--带背景和周围要素的逐要素导出地理 商务合作,科技咨询,版权转让:向日葵,135-4855__4328,xiexiaokui#qq.com 目的:导出多边形要素类的每个要素 实 ...

  4. GIS空间分析案例_图层逐要素导出地理处理工具

    GIS空间分析案例_图层逐要素导出地理处理工具 商务合作,科技咨询,版权转让:向日葵,135-4855__4328,xiexiaokui#qq.com 目的:导出图层的每个要素 使用方法:指定输入图层 ...

  5. ArcGIS空间分析工具

    1. 3D分析 1.1. 3D Features toolset 工具 工具 描述 3D Features toolset (3D 要素工具集) Add Z Information 添加 Z 信息 添 ...

  6. 基于ArcGIS for Server的服务部署分析 分类: ArcGIS for server 云计算 2015-07-26 21:28 11人阅读 评论(0) 收藏

    谨以此纪念去年在学海争锋上的演讲. ---------------------------------------------------- 基于ArcGIS for Server的服务部署分析 -- ...

  7. [转] 基于ArcGISServer实现活动地图标注

    ——王嘉彬(Esri中国上海分公司) 1.背景 1.1.主流互联网地图应用的现状 在目前主流的互联网地图应用中,如 Google Map(图 1).搜狗地图(图2),POI 兴趣点的文字标注越来越多的 ...

  8. JavaScript 空间分析库——JSTS和Turf【转】

    https://blog.csdn.net/neimeng0/article/details/80363468 前言 项目中有管线的空间拓扑关系查询需求,在npm中检索到JSTS和Turf两个Java ...

  9. Web地图服务、WMS 请求方式、网络地图服务(WMS)的三大操作

    转自奔跑的熊猫原文 Web地图服务.WMS 请求方式.网络地图服务(WMS)的三大操作 1.GeoServer(地理信息系统服务器) GeoServer是OpenGIS Web 服务器规范的 J2EE ...

  10. ArcGIS for Desktop入门教程_第七章_使用ArcGIS进行空间分析 - ArcGIS知乎-新一代ArcGIS问答社区

    原文:ArcGIS for Desktop入门教程_第七章_使用ArcGIS进行空间分析 - ArcGIS知乎-新一代ArcGIS问答社区 1 使用ArcGIS进行空间分析 1.1 GIS分析基础 G ...

随机推荐

  1. salesforce零基础学习(一百二十三)Transaction Security 浅入浅出

    本篇参考: https://help.salesforce.com/s/articleView?id=sf.enhanced_transaction_security_policy_types.htm ...

  2. RSA中用到的推导,笔记持续更新

    1.同余式组求p和q 已知条件: 推导过程: 根据上述已知条件,以及同余式性质,我们可以得到如下: c1e2 = (2p + 3q)e1*e2 mod N c2e1 = (5p + 7q)e1*e2  ...

  3. android studio 写一个桌球简单页面

    首先: 保存素材图: 其次: 参考:https://blog.csdn.net/nanhaoluo23/article/details/111144033 一步一步来,导入素材我就卡住了,找不到 于是 ...

  4. py教学之元组

    元组介绍 Python 的元组与列表类似,不同之处在于元组的元素不能修改. 元组使用小括号 ( ),列表使用方括号 [ ]. 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可. tup1 = ...

  5. 前端必备基础知识之--------原生JS发送Ajax请求

    原生JS发送Ajax请求 ajax({ type: 'POST', url: 'http://10.110.120.123:2222', // data: param, contentType: 'a ...

  6. freeswitch号码黑名单

    概述 freeswitch是一款简单好用的的VOIP开源软交换平台. 在客户的呼叫过程中,会遇到一些异常的号码,包括高投诉风险号码.敏感号码.特殊号码等. 在客户呼叫流程中,需要针对这些异常号码做呼叫 ...

  7. 读C#代码整洁之道笔记07_代码评审和集成测试

    1. 代码评审注意事项 1.1. 始终保持代码评审的意识 1.2. 保证代码构建成功 1.3. 确保所有的测试都是通过的 1.4. 注意YAGNI原则 1.5. 检查重复代码 1.6. 使用静态分析器 ...

  8. java基础:方法

    方法 方法是解决一类问题的步骤的有序组合 包含于类/对象中 设计原则 方法的原子性:一个方法只实现一个功能 定义与调用 方法的组成: 方法的调用 若方法返回值为空 System.out.println ...

  9. CSAPP 配套实验 DataLab

    第一次写博客,当作随笔留给自己看吧,如果能帮到读者,是我的荣幸. 这是 CSAPP 的配套实验 DataLab,概括的来说就是在较严格的限制条件下把 15 个函数补充完整. 本人能力没有那么强,很多题 ...

  10. Task记录3 :ContinueWith ,CancellationToken,的结合

    static void Main(string[] args) { //1.创建取消令牌数据 CancellationTokenSource tokenSource = new Cancellatio ...