Web GIS多种方式发布动态地图服务及显示（3）
目录
- PostGIS+GeoServer+OpenLayers发布动态地图服务
- 第三章 开源方案Web GIS地图发布及显示
- 3.1 系统框架结构图及描述
- 3.1.1 PostGIS
- 3.1.2 GeoServer
- 3.1.3 OpenLayers
- 3.2 地图初始化案例
- 3.2.1 配置环境
- 3.2.2 数据入库
- 3.2.2.1 创建空间数据库
- 3.2.2.2 Postgis连接数据库
- 3.2.2.3 添加Shpfile文件
- 3.2.3 GeoServer发布动态地图服务
- 3.2.3.1 启动GeoServer
- 3.2.3.2 加载数据
- 3.2.3.3 发布动态地图服务
- 3.2.3.4 预览地图
- 3.2.4 Openlayers调用地图服务
- 3.2.4.1 构建装载数据的框架
- 3.2.4.2 调用动态地图
- 3.2.5 数据展示
PostGIS+GeoServer+OpenLayers发布动态地图服务
第三章 开源方案Web GIS地图发布及显示
3.1 系统框架结构图及描述
开源Web GIS的系统框架一般以GeoServer
服务器为地图服务层、Postgis为数据层、OpenLayers为视图层，如下图3-1所示。Web服务层响应客户端请求，根据请求类型调用GeoServer服务器所提供的地图图层，与此同Web
服务层通过OpenLayers优化从Postgis数据库中调用的地理信息数据并渲染地图，最终客户端利用浏览器实现对空间数据的显示和用户的交互。
图3-1 系统架构图
3.1.1 PostGIS
PostGIS是一个开源程序，它为对象-关系型数据库PostgreSQL提供了存储空间地理数据的支持，使PostgreSQL成为了一个空间数据库，能够进行空间数据管理、数量测量与几何拓扑分析。
PostGIS基于 PostgreSQL，故需要先安装 PostgreSQL，后安装PostGIS。
3.1.2 GeoServer
Geo Server 是一个开源项目，它是依托OpenGIS服务器规范，数据源的支持主要有MySQL、PostgreSQL、Oracle等，能够对应输出多种格式的网络地图资源，例如png、gif、jpeg等。当嵌入MapBuilder时，可以支持AJAX的地图客户端
OpenLayers。
Geo Server 提供了全面遵循OGC（Open
GISConsortium，开放地理空间信息联盟）开放标准的网络地图服务和网络要素服务规范，并支持WFS-T（Web Feature Service - Transactional）。其中网络地图服务能将地理位置信息数据转换成地图图层影响，并根据上述数据绘制地图；网络要素服务能对数据进行增删改查操作，并能将数据转换成要素级的地理标记语言编码。利用Geo Server 可以方便地发布地图数据以及在用户之间迅速共享空间地理信息。
3.1.3 OpenLayers
OpenLayers是一个专为WebGIS客户端开发提供的JavaScript类库，用于实现符合行业标准格式的地图数据访问方法。OpenLayers采用OpenGIS的WMS和WFS规范，从而保证了开发人员可以自由添加功能，为地理空间数据的信息化处理提供了极大的便利。
开发者可以通过 OpenLayers实现在浏览器中对地图数据的平移、放大、缩小、选取面、选取线、要素选择、图层叠加等操作。
3.2 地图初始化案例
3.2.1 配置环境
软件及版本对应号
GeoServer：2.15.1
Postgresql：12.1
Postgis：3.0.0
Openlayers：6.1.1
3.2.2 数据入库
3.2.2.1 创建空间数据库
在安装好PostgreSQL后，打开“pgAdmin4”，进入PostgreSQL的主控制界面。创建一个新的数据库如下图3-2-1所示。
图3-2-1 创建数据库
创建完数据库后，这还不能进行空间数据的存储，还需要往其中添加扩展。数据库【右键】|【QueryTool】，进行填写SQL语句的界面，写下以下语句：
CREATE EXTENSION postgis;
创建postgis扩展模块，这样才可以使用空间数据库进行数据的存储。创建完成后，查看数据库中的扩展模块，如下图3-2-2所示，即创建postgis模块成功。
图3-2-2 查看模块
3.2.2.2 Postgis连接数据库
打开postgis程序，如下图3-2-3所示。
图3-2-3 打开程序
进入postgis界面，选择顶部【View connection details】，打开数据库的连接界面如下图3-2-4所示，进行空间数据库的连接。
图3-2-4 空间数据库连接
若连接成功，则在返回的主界面的底部“log Window”中会出现如下图3-2-5所示提示，表示连接成功。
图3-2-5 数据库连接成功
3.2.2.3 添加Shpfile文件
点击主界面中的“Add File”，把我们数据进行加载，选择完成后如下图3-2-6所示。
图3-2-6 加载数据
将文件的的SRID（空间参考信息）值更改为2384，其他信息则默认。
SRID是根据数据的坐标来定义的，由于我们数据的坐标已经经过处理，为“Xian_1980_3_Degree_GK_CM_117E”的投影坐标，因此根据这个投影坐标，到https://spatialreference.org/ref/这个网站中，去查找相应的SRID号，即可对应地找到其SRID为2384。
出现问题：PostGIS中dbf file (.dbf) can not be opened.shapefile import failed
如下图3-2-7所示。
图3-2-7 数据无法加载
解决问题：
你提供的路径中含有中文。不要在导入的文件内含有中文，另外数据库字符集格式要是utf-8的。因此换路径后，再次导入数据，即可出现如下图3-2-8所示，加载成功。
图3-2-8 数据加载成功
加载成功后返回PostgreSQL主界面中，刷新空间数据库，发现如下图3-2-9所示，即表示数据加载成功。
图3-2-9 数据库中查看数据
3.2.3 GeoServer发布动态地图服务
3.2.3.1 启动GeoServer
装好GeoServer后，需要Star GeoSever，如下图3-2-10所示。
图3-2-10 打开 GeoServer服务
打开GeoServer服务后，在网页上输入http://localhost:8080/geoserver/web/?1跳转到GeoServer的主控制页面，按照安装时候的设置进行用户的登录。
3.2.3.2 加载数据
首先需要创建一个新的工作区，如下图3-2-11所示，参数如3-2-12所示。
图3-2-11 创建工作区
图3-2-12 参数设置
在创建好工作区后，需要新建一个新的数据源进行数据存储，如下图3-2-13所示。
图3-2-13 新建数据源
具体参数设置如下图3-2-14所示，在数据源名称输入：dltb，其他参数则视情况进行参数的设置与调整。
图3-2-14 参数设置
3.2.3.3 发布动态地图服务
上述加载数据保存后，在图层中，即可查看到我们新建的图层，如下图3-2-15所示。
图3-2-15 数据信息
点击【发布】按钮，进入编辑图层页面，简单输入摘要信息，值得注意的是下面的边框，分别点击"从数据中计算"和"Compute from native bounds"来生成图层的bounding box，如下图3-2-16所示。
图3-2-16 计算图层的边框
点击【保存】，进行数据设置的存储。
3.2.3.4 预览地图
在Layer Preview中找到“dltb”如下图3-2-17所示，再点击旁边的“OpenLayers”进行数据的预览，如下图3-2-18所示。
图3-2-17 进入Layer Preview界面
图3-2-18 找到dltb进行预览操作
如下图3-2-19所示，预览数据。
图3-2-19 预览数据
此时需要记录下当前的url地址，结合后面的openlayer二次开发包渲染到页面上。
http://localhost:8080/geoserver/shukengcun/wms?service=WMS&version=1.1.0&request=GetMap&layers=shukengcun:dltb&bbox=412517.46875,2695044.75,414496.09375,2697247.25&width=689&height=768&srs=EPSG:2384&format=application/openlayers
3.2.4 Openlayers调用地图服务
3.2.4.1 构建装载数据的框架
构建装载数据的框架，需要用到前端三件套的基本知识，即前端的基本知识，此处不再赘述，代码如下：
<!DOCTYPE html><html lang=“en”><head><meta charset=‘utf-8’ /><title>运用openlayer访问geoserver发布的地图</title><link rel=“stylesheet” href="./css/ol.css"><script type=‘text/javascript’ src=’./js/ol.js’></script><style>html,body {height: 100%;border: 0px;margin: 0px;padding: 0px;}#map {width: 100%;height: 90%;border: 1px solid;}</style></head><body><div id=“map”></div></body></html>
3.2.4.2 调用动态地图
通过查找帮助文档可知，在ol中的source库中，有TileWMS这个API，其主要的功能为“来自WMS服务器的平铺数据的层源”，如下图3-2-20所示，即我们这次调用地图的API。
图3-2-20 使用的API帮助文档
因此代码如下所示：
<script type=“text/javascript”>var map = new ol.Map({target: ‘map’,view: new ol.View({//经纬度，这里最主要是参考发布时候计算出来的经纬度，因此一定要把计算出来的经纬度查出来center: ol.proj.fromLonLat([116.137,24.356]),zoom: 14})});var baseSource = new ol.source.TileWMS({url: ‘http://localhost:8080/geoserver/shukengcun/wms’,params: {‘LAYERS’: ‘shukengcun:dltb’,‘TILED’: true},serverType: ‘geoserver’});var baseLayer = new ol.layer.Tile({source: baseSource});map.addLayer(baseLayer);</script>
3.2.5 数据展示
打开该index.html，即可查看如下图3-2-21所示已成功发布的调用动态地图服务显示。
图3-2-21 数据调用成功
Web GIS多种方式发布动态地图服务及显示（3）相关推荐
- Web GIS多种方式发布动态地图服务及显示（2）
目录 GeoDatabase+ArcServer+Arcgis API for Javascript发布动态地图服务 第二章 主流的Web GIS地图发布及显示 2.1 框架结构图及描述 2.1.1 ...
- （一）ArcGIS JS 发布动态地图服务
前言 在 WebGIS开发的过程中,地图服务的发布和获取是项目的第一步,也是进行WebGIS开发的基础.我们需要发布自己的数据服务,在本篇博客中主要说明一下如何利用ArcGIS Server发布自己的 ...
- （一）ArcGIS Server之发布动态地图服务
文章目录 1.引言 2.什么是地图服务? 3.地图服务之动态地图服务 4.利用ArcMap发布动态地图服务 4.1用ArcMap打开我们想要发布为服务的数据 4.2为了发布出来的数据好看一点,我们可以 ...
- 一、ArcGIS Server篇：利用ArcGIS Server发布动态地图服务
写在前面的话:本篇博客参考 在WebGIS开发过程中,我们所需要的数据不仅仅来自于ArcGIS online,有时候我们需要发布自己的数据服务,在本篇博客中主要说明一下如何利用ArcGIS Serve ...
- 多种方式发布WebGIS地图服务以及显示
目录 一.WebGIS基础 1. 什么是WebGIS?(WebGIS的介绍.技术.架构.功能/应用.产品) 2. OGC规范 3. 主流WebGIS架构 4. 主流GIS服务器 4.1 ArcGIS ...
- 通过google app engine 在google cloud 部署支持quic的Java web 应用(多种方式)
quic最先是由google提出并完善的,18年google cloud支持了quic协议,我尝试在google上部署一套自己的应用,并使其支持quic协议 google的文档还是非常完善的,只是类似 ...
- hp服务器通过ilo5安装系统,HPE ProLiant Gen10 通过iLO 5（v1.15） web界面多种方式更新服务器固件，包含升级系统恢复集方法...
一.iLO web界面固件&操作系统软件界面简单介绍 1.固件 这个界面可以查看服务器安装的固件版本,可以查看以下类型的固件: u电源管理控制器Power Management Control ...
- WCF技术剖析之二十九：换种不同的方式调用WCF服务[提供源代码下载]
原文:WCF技术剖析之二十九:换种不同的方式调用WCF服务[提供源代码下载] 我们有两种典型的WCF调用方式:通过SvcUtil.exe(或者添加Web引用)导入发布的服务元数据生成服务代理相关的代码 ...
- （三）ArcGIS API For Javascript之调用动态地图服务
文章目录 1.引言 2.调用动态地图服务 3.需求 3.1.根据需求隐藏服务中的某一个图层 3.1.1代码解释: 3.2.通过属性查询地图服务中的信息 3.2.1.代码实现 3.2.2代码解释 3.3 ...
最新文章
- 图解一次手动杀马过程
- 48. C# -- 事件
- 实现Android和PC之间的蓝牙通信
- PYG教程【一】入门
- H.264学习（一）——帧和场的概念
- 飞秋的模拟实现代码，很好很山寨！
- Docker 的两类存储资源 - 每天5分钟玩转 Docker 容器技术（38）
- linux 设备挂载ppt,.linux 挂载各种设备.pdf
- 有关 this 指向问题总结
- Python 抓取网页乱码问题 以及EXCEL乱码
- 启动和停止数据库——停止例程
- [WCF] Contract
- XBOX360游戏发售表(12月1日)
- 网络工程师还吃香吗？
- main java.lang,各位大哥办我看看,Exception in thread main java.lang.Error: 无法解析的编译有关问题...
- MATLAB箭头绘制 arrow3 函数与 quiver3 函数的实用教程
- codefroces13A
- 现在学校应用较多的计算机学籍管理系统,计算机基础知识选择题500个
- MobaXterm专业版（含授权）
- 支持向量机 (三)： 优化方法与支持向量回归
热门文章
- VUE+OSS安全令牌实现图片前端直传
- Windows远程桌面（mstsc）笔记：Windows 7远程桌面连接Windows Server 2019报错：“您的凭证不工作“
- 图像分割(七) —— Transformer and CNN Hybrid Deep Neural Network
- wp load.php下载,wordpress网站打开首页出现下载页面解决方法
- FreeRTOS学习九（锁机制）
- 大众标准化杂志大众标准化杂志社大众标准化编辑部2023年第12期目录
- 附晋级总决赛名单（三） | 风起云涌，号角吹响
- 2023年电梯行业研究报告
- 深度学习延时系统solve_dde_ibp
- 有符号数、无符号数理解