geoserver+openlayers4

最新推荐文章于 2020-07-01 17:25:52 发布
最新推荐文章于 2020-07-01 17:25:52 发布
阅读量279 收藏
点赞数
分类专栏： webgis 文章标签： geoserver openlayers4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011262117/article/details/64122217
版权
<!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="https://openlayers.org/en/v4.0.1/css/ol.css" type="text/css">
    <style>
      .map {
        height: 630px;
        width: 1360px;
      }
    </style>
    <script src="https://openlayers.org/en/v4.0.1/build/ol.js" type="text/javascript"></script>
    <title>OpenLayers example</title>
  </head>
  <body style="width:100%;height=100%;margin:0px">
    <div id="map" class="map"></div>
    <script type="text/javascript">
// 发布geoverser BBOX 值得范围，分别代表图层的minx,miny,maxx,maxy
var extent=[73.5577011108401,18.1593055725098,134.77392578125,53.5608596801759];
      var map = new ol.Map({
        target: 'map',
layers: [
     
        new ol.layer.Image({
          source: new ol.source.ImageWMS({
            url: 'http://localhost:8088/geoserver/CHINA/wms',
            params: {'LAYERS': 'CHINA:chn_adm1','SRS':'EPSG:4326','VERSION':'1.1.0','WIDTH':'1360px', 'HEIGHT':'630px','BBOX':extent },
            serverType: 'geoserver'
          })
        })
      ],
        view: new ol.View({
//center: 自己指定
          center: [100,35],
          zoom: 2,
 projection:new ol.proj.Projection({
 code: 'EPSG:4326',
 units:'degrees',
 extent:extent  //扩展渲染
      })
        })
      });
    </script>
  </body>
</html>
我是一只奋斗的蜗牛
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
OpenLayers学习笔记高级篇（四、地图开发实战之Geoserver配置与发布地图服务）
MagicMHD的博客
06-11 2564
本节将讲解ol使用wfs同后台geoserver进行交互，从而实现要素的增删改查。由于geoserver需要服务器端，所以我们将从环境搭建开始讲解，使用公开的数据源，进行查询，修改，添加，删除操作的演示，使得大家最终学会。 1、Geoserver环境配置 由于wfs协议涉及到跨域的问题，在配置过程中，我们也将把跨域的环境配置好。虽然跨域的解决方式有很多，但此处选择一个稍微简单的方式，详见下面的...
GeoServer(地图服务器)
热门推荐
huangpengniubi的博客
12-28 3万+
本文章主要介绍geoserver的安装以及使用:   什么是geoserver?它是干什么的? GeoServer是一个server开源,允许用户查看和编辑地理数据,这是地理信息系统领域. GeoServer的安装:            下载地址: http://geoserver.org/download/ 对于包选择自己需要的进行下载,然后双击进行安装,跟常规安装一样,一直n...
openlayers4 加载 geoserver WFS服务
爱明爱夏的博客
01-18 1214
当使用openlayers加载geoserver的WFS服务时，会遇到跨域访问错误。网上有很多处理方法，这里介绍一种我试用成功的方法。在geoserver的安装目录中，找到geoserver/webapps/geoserver/WEB-INF/web.xml文件，然后找到以下两快，然后取消该两处的注释。最后重启geoserver服务即可。openlayers 版本：4.6.4geoserver 版
openlayer加载geoserver发布的wfs图层方法
hsg77的专栏
07-01 567
openlayer加载geoserver发布的wfs图层方法 //测试添加wfs图层 var t_geoserver_url="http://192.168.30.16:8080/geoserver"; this.map.addLayer(this.map.createLayerByWFSJsonp("onemap:bz_point","wfs标记点图层",t_geoserver_url)); this.map.addLayer(this.map.createLayerB
学习笔记：利用GeoServer结合uDig发布WMS详细过程
weixin_30412577的博客
04-01 154
在本地已有shp格式地图数据的条件下通过Geoverser发布WMS。 环境要求：JDK， GeoServer， uDig 1.在本地拷入要发布的shp数据 在开始菜单中单击进入该文件夹 依次进入下图路径，并新建一个文件夹（如wms1），尽量用英文。并将要发布的数据拷入刚新建的wms1的文件夹内 2.登录进GeoServer地图发布页 单击Start GeoServer ...
geoserver+openlayer
08-06 4755
早在二月份就接触到了geoserver，当时只是将自己转出的数据(postgre+postgis)存储。而geoserver则只是做一个大概的图形化检查工具。后来发现了c/s模式的开源软件qgis，就暂时把geoserver放在了一边。这两天不停的折腾geoserver。当时只是成功的改写了sld，现在还没有找到当时写的文档，有空补起来。今天想做的一个功能就是将几个layer叠加显示。首先就是
OpenLayers+Geoserver 简单入坑
u014455405的博客
10-03 6702
Geoserver         发布一个shp数据                          1  将要发布的数据放入数据存放的文件夹                                                    2   如图打开Geoserver的发布数据界面
geoserver+postgis+openlayers 空间要素的增删改
06-13
geoserver+postgis+openlayers 空间要素的增删改功能，具体还可参考https://blog.csdn.net/rrrrroy_Ha/article/details/90904465
JAVA+GeoServer+OpenLayers.zip_Openlayers java_geoserver_idae开发
07-14
Java+OpenLayers3+GeoServer 二次开发应用
GeoServer + shp + Vue +OpenLayers使用
Civitasv
03-17 3991
GeoServer + shp + Vue +OpenLayers使用
geoServer+openLayers简单小例子
07-14
4. **添加交互功能**：OpenLayers提供了丰富的API来实现地图的交互功能。例如，可以添加ZoomIn/ZoomOut控件，实现地图的放大和缩小；使用Move事件处理函数，实现地图的平移；利用测量工具，可以进行距离和面积的测量...
论文研究-基于GeoServer和OpenLayers的WebGIS遥感服务系统的设计与实现 .pdf
08-27
基于GeoServer和OpenLayers的WebGIS遥感服务系统的设计与实现，何鑫，，随着信息技术的飞速发展及空间地理数据量的空前增长，传统的地理信息系统已经无法满足空间地理数据的获取、处理、共享、存储等需
openlayers4+geoserver wfs实现空间分析、属性查询
gisdoer
03-09 6859
openlayers4，geoserver wfs实现空间分析、属性查询 原理 工作区启用WFS 工作区下发布图层 代码 var featureRequest = new ol.format.WFS().writeGetFeature({ srsName: 'EPSG:4326',//坐标系统 featureNS: 'zj...
openlayer3 系列 3 - 加载 geoserver 图层
bitree1的博客
06-21 1152
1.加载geoserver wms服务 //url为geoserver的wms服务地址 lyr = new ol.layer.Tile({ source:new ol.source.TileWMS({ extent:[112,22,114,24], params:{ ...
openlayers4加载Esri和GeoServer的各类服务图层
sxzhustar的专栏
03-14 7945
图层的加载是gis应用中最基本的操作，很多时候在api的使用中，没出问题觉得简单至极，但哪里参数没配置对，就是一道迈不过去的坎。俺在实践中加载geoserver和esri的各类图层，就此记录下，方便不时之需，也供学习交流。ol加载esri服务图层1、ol加载mapserver服务// url为MapServer服务地址 var lyr = new ol.layer.Tile({
OpenLayers环境搭建与配合GeoServer显示地图
超频化石鱼的博客
10-07 1万+
OpenLayers是一个js库，用于显示各个地图服务所提供的数据，例如ArcGIS，GeoServer等。这里结合GeoServer使用来显示地图。 1. 从官网下载OpenLayers库。解压后放入web工程下。 http://openlayers.org/ 2. 将js与css文件导入到页面中。这里版本为v5.0。 &lt;link rel="stylesheet" href="v...
Geoserver & Openlayers 学习笔记
weixin_30585437的博客
08-03 2712
Geoserver简介 Geoserver是一个功能齐全，遵循OGC开放标准的开源WFS-T和WMS服务器。利用Geoserver可以把数据作为maps/images来发布(利用WMS来实现)也可以直接发布实际的数据(利用WFS来实现)，同时也提供了修改，删除和新增的功能(利用WFS-T)。 GeoServer, 顾名思义,是一个Server. 它是开源的 ，允许用户查看和编辑地理数据。...
openLayers叠加geoserverWMS服务
qq_34870529的博客
05-15 1289
1：代码展示&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
基于python贫困生资助管理系统带vue前后端分离设计源代码+文档说明+数据库文件
最新发布
09-01
基于python贫困生资助管理系统带vue前后端分离设计源代码+文档说明+数据库文件，含有代码注释，新手也可看懂，个人手打98分项目，导师非常认可的高分项目，毕业设计、期末大作业和课程设计高分必看，下载下来，简单部署，就可以使用。 基于python贫困生资助管理系统带vue前后端分离设计源代码+文档说明+数据库文件，含有代码注释，新手也可看懂，个人手打98分项目，导师非常认可的高分项目，毕业设计、期末大作业和课程设计高分必看，下载下来，简单部署，就可以使用。 基于python贫困生资助管理系统带vue前后端分离设计源代码+文档说明+数据库文件，含有代码注释，新手也可看懂，个人手打98分项目，导师非常认可的高分项目，毕业设计、期末大作业和课程设计高分必看，下载下来，简单部署，就可以使用。 基于python贫困生资助管理系统带vue前后端分离设计源代码+文档说明+数据库文件，含有代码注释，新手也可看懂，个人手打98分项目，导师非常认可的高分项目，毕业设计、期末大作业和课程设计高分必看，下载下来，简单部署，就可以使用。基于python贫困生资助管理系统带vue前后端分离设计源代码+文档
路径分析—postgresql+geoserver+openlayers
11-12
在本例中，我们将使用PostgreSQL数据库、GeoServer和OpenLayers来实现路径分析。 首先，我们需要将网络数据导入PostgreSQL数据库。我们可以使用PostGIS插件来处理空间数据，它提供了丰富的空间分析功能。将网络数据...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值