接上篇，前面在ArcMap中和Postgis中将数据都已经进行了预处理。

接下来回到Geoserver中，进行数据发布。

1、新建工作区

2、填写完工作区信息

3、打开数据存储，添加新的数据存储

4、新建数据源，选择PostGIS

5、依次填写完如下信息，保存即可

6、添加新图层

7、新建图层，将前面处理好的图层发布，作为底图（这里发布两个图层，一个底图，一个sql图层）

8、底图发布完成后，再新建一个图层，这次选择“配置新的SQL视图”

9、填写完红框信息，保存

sql 视图：
SELECT * FROM pgr_shortestpath(‘zy’, %x1%, %y1%, %x2%, %y2%)
验证的正则表达式：^-?[\d.]+$
类型：LingString
SRID：3857

10、验证，Openlayers调用

改一下调用地址和点击坐标即可

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title>网络分析</title>

    <link href="../lib/css/ol.css" rel="stylesheet" type="text/css">

    <style>

        #id {

            width: 1000px;

            height: 1000px;

        }

    </style>

    <script type="text/javascript" src="../lib/ol/ol-debug.js"></script>

</head>

<body>

    <div id="map"></div>

    <script>

        var roadLayer = new ol.layer.Tile({

            source: new ol.source.TileWMS({

                url: 'http://10.19.151.238:8080/geoserver/NA/wms',

                params: { 'LAYERS': 'NA:zy', 'TILED': true },

                serverType: 'geoserver'

            })

        })

        var map = new ol.Map({

            target: document.getElementById("map"),

            layers: [

                roadLayer

            ],

            view: new ol.View({

                center: [12985322, 4799338],

                projection: 'EPSG:3857',

                zoom: 12

            })

        });

        var startCoord = [12991487.849, 4800716.518];

        var destCoord = [12993333.603, 4799171.652];

        var params = {

            LAYERS: 'NA:func_shortestpath',

            FORMAT: 'image/png',

        };

        var viewparams = [

            'x1:' + startCoord[0], 'y1:' + startCoord[],

            'x2:' + destCoord[], 'y2:' + destCoord[]

            //'x1:' + 12952117.2529, 'y1:' + 4836395.5717,

            //'x2:' + 12945377.2585, 'y2:' + 4827305.7549

        ];

        console.log(viewparams);

        params.viewparams = viewparams.join(';');

        result = new ol.layer.Image({

            source: new ol.source.ImageWMS(

                {

                    url: 'http://10.19.151.238:8080/geoserver/NA/wms',

                    params: params

                })

        });

        console.info(result);

        map.addLayer(result);

    </script>

</body>

</html>

11、原理

PostGIS做的网络分析，主要原理在于将数据建立拓扑后，导入到PostGIS数据库

先用pgRouting插件里带有的dijkstra算法接口，找出两点间的最短路径经过的线段，通过截取、拼接的方式美化开始段、结束段，最后用函数的形式封装完，利用Geoserver发布成服务

前端页面用Openlayers调用服务，实现功能展示

12、正式版效果

PostGIS 结合Openlayers以及Geoserver实现最短路径分析（三）的更多相关文章

  1. PostGIS 结合Openlayers以及Geoserver实现最短路径分析（二）

    前文讲述了怎么用ArcMap制作了测试数据,并导入了PostGIS,接下来我们需要结合PgRouting插件,对入库的数据再进行一下处理. 1.在pgAdmin中,执行下面的sql语句 --添加起点字 ...

  2. PostGIS 结合Openlayers以及Geoserver实现最短路径分析（一）

    环境: Win10 ArcMap10.4(用于数据处理) postgresql9.4 postgis2.2.3 pgRouting2.3(postgresql插件) ##附上本文配套素材下载地址:ht ...

  3. postgresql+postgis+pgrouting实现最短路径查询（2）－－－openlayers＋geoserver实现最短路径

    自己的最短路径实现基本上是按照参考博文的1.2和3进行的,实现的时候也是问题不断,只能是一个一个解决. 问题1:自己发布的geoserver服务无法和OSM底图叠加到一起. 解决:参考博文2提到发布服 ...

  4. Arcgis Engine最短路径分析

    ArcEngine 最短路径分析(源码)   using System; using ESRI.ArcGIS.Carto; using ESRI.ArcGIS.Geometry; using ESRI ...

  5. ArcGIS API for JavaScript 4.2学习笔记[27] 网络分析之最短路径分析【RouteTask类】

    要说网页端最经典的GIS应用,非网络分析莫属了. 什么?你没用过?百度高德谷歌地图的路线分析就是活生生的例子啊!只不过它们是根据大实际背景优化了结果显示而已. 这个例子使用RouteTask进行网络分 ...

  6. arcgis api 3.x for js 入门开发系列十三地图最短路径分析（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  7. 以Network Dataset（网络数据集）方式实现的最短路径分析

    转自原文 以Network Dataset(网络数据集)方式实现的最短路径分析 构建网络有两种方式,分别是网络数据集NetworkDataset和几何网络Geometric Network,这个网络结 ...

  8. ArcGIS网络分析之Silverlight客户端路径分析(三)

    原文:ArcGIS网络分析之Silverlight客户端路径分析(三) 首先贴上最终的效果图: a.路径查询 2.最近设施点查询 3.服务区分析 说明: 1.以上的示例使用的数据是随意在ArcMap中 ...

  9. OpenLayers 3+Geoserver+PostGIS实现点击查询

    WebGIS开发中,点击查询是最经常使用的一种查询方式,在ArcGIS api 中.这样的查询叫IdentifyTask,主要作用是前台提交參数.交ArcServer查询分析返回. 本文从开源框架的角 ...

随机推荐

  1. Leetcode（2）两数相加

    Leetcode(2)两数相加 [题目表述]: 给出两个 非空 的链表用来表示两个非负的整数.其中,它们各自的位数是按照 逆序 的方式存储的,并且它们的每个节点只能存储 一位 数字. 如果,我们将这两 ...

  2. excel函数--笔记

    1: =DATE(MID(A1,1,4),MID(A1,5,2),MID(A1,7,2)) 字符串返回日期类型 2:  WEEKDAY(serial_number,return_type) ▪ ser ...

  3. Python 破解Linux密码

    简介:因为Linux的密码都是加密过的(例如:$6$X.0bBN3w$NfM7YYHevVfCnZAVruItAEydaMJCF.muefZsxsgLK5DQoahW8Pqs1BSmoAFfi5J/b ...

  4. SpringBoot注入配置文件的3种方法

    方案1:@ConfigurationProperties+@Component 定义spring的一个实体bean装载配置文件信息,其它要使用配置信息是注入该实体bean /** * 将配置文件中配置 ...

  5. 2018.8.20 Python之路---常用模块

    一.re模块 查找: re.findall(‘正则表达式’,‘字符串’) 匹配所有符合正则表达式的内容,形成一个列表,每一项都是列表中的一个元素. ret = re.findall('\d+','sj ...

  6. 网页开发利用jq自定义鼠标右击事件

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. 【原创】go语言学习（十一）package简介

    目录 Go源码组织方式 main函数和main包 编译命令 自定义包 init函数以及执行行顺序 _标识符 Go源码组织方式 1. Go通过package的方式来组织源码 package 包名 注意: ...

  8. MyBatis的几个重要概念和工作流程

    MyBatis 几个重要的概念 Mapper 配置: Mapper 配置可以使用基于 XML 的 Mapper 配置文件来实现,也可以使用基于 Java 注解的 MyBatis 注解来实现,甚至可以直 ...

  9. 第三十一章 System V信号量（二）

    用信号量实现进程互斥示例 #include <unistd.h> #include <sys/types.h> #include <stdlib.h> #inclu ...

  10. 前端技术之：JS开发几个有意思的东东

    一. 查看性能分析报告 npm run build:prod --report ​ 二.vue ui工具 ​ ​ 三.vue-element-admin https://panjiachen.gite ...