首先看openlayers官网中wmts模块，https://openlayers.org/en/latest/apidoc/module-ol_source_WMTS-WMTS.html，里面的参数看你需要什么。

下面是我的代码

这个是需要地图需要参数，controlId是封装所需要的，而这个layerName对应得就是openlayer的layer字段，url就是openlayers的url字段。

怎么在geoserver中找他们呢？跟着图片来。

选择png后看源码，这个源码也就是openlayer的代码，不会写可以在上面抄写。

这里面会有你想要的，细心的伙伴你会发现，url对应不上，源码中的是../service/wmts,你这样写里面肯定是不行的啊，所以看上面的url,一定是你的域名+端口号+文件路径，到demo前面，

所以最后的路径就是   http://www.***********.com:8080/geoserver/gwc/service/wmts

希望有需要的小伙伴会有那么一丢丢的帮助，我也是初学者为自己记录，请大牛们多多指教。

openLayers中WMTS结合GeoServer呈现瓦片地图的更多相关文章

  1. Geoserver 谷歌瓦片地图的使用 多级发布

    下面,我来介绍一下如何在离线的情况下,在Geoserver 中配置出如同谷歌地图般绚丽的效果. 为了让大家有动力看我我接下来写的东西,我先把结果图给大伙儿展现一下: 正如上图所示,该地图是谷歌第四级的 ...

  2. OpenLayers加载谷歌地球离线瓦片地图

    本文使用OpenLayers最新版本V5.3.0演示:如何使用OpenLayer加载谷歌地球离线瓦片地图.OpenLayers 5.3.0下载地址为:https://github.com/openla ...

  3. 瓦片地图与geoserver发布

    本文主要包括以下内容 TileMill生成Tile影像金字塔(.mbtiles压缩文件) Mbutil(https://github.com/mapbox/mbutil)解压缩 Apache HTTP ...

  4. 使用openlayers 3 在线加载天地图及GeoServer发布的地图

    使用openlayers3来加载天地图卫星图和标注图层,GeoServer发布地图,一并用openlayers测试加载出来,顺便实现了7种地图控件.下面直接贴代码: <!DOCTYPE html ...

  5. OpenLayers加载高德地图离线瓦片地图

    本文使用OpenLayers最新版本V5.3.0演示:如何使用OpenLayer加载谷歌地球离线瓦片地图.OpenLayers 5.3.0下载地址为:https://github.com/openla ...

  6. OpenLayers加载百度离线瓦片地图（完美无偏移）

    本文使用OpenLayers最新版本V5.3.0演示:如何使用OpenLayer完美无偏移加载百度离线瓦片地图.OpenLayers 5.3.0下载地址为:https://github.com/ope ...

  7. OpenLayers中地图缩放级别的设置方法

    来源于:http://www.cnblogs.com/sailheart/archive/2011/03/15/1984519.html 一.概述 在OpenLayers中,地图必须具有一个缩放级别的 ...

  8. Cocos2d-JS中瓦片地图API

    为了访问瓦片地图,Cocos2d-JS中访问瓦片地图API,主要的类有:TMXTiledMap.TMXLayer和TMXObjectGroup等.1.TMXTiledMapTMXTiledMap是瓦片 ...

  9. OpenLayers学习笔记（一）—在线加载谷歌影像地图&离线加载本地瓦片地图

    实现根据在线离线判断加载地图, 在线加载谷歌影响地图, 离线加载本地瓦片地图 作者: 狐狸家的鱼 Github: 八至 html代码 <div id="map" tabind ...

随机推荐

  1. Spark Steaming消费kafka数据条数变少问题

    对于基于Receiver 形式,我们可以通过配置 spark.streaming.receiver.maxRate 参数来限制每个 receiver 每秒最大可以接收的记录的数据:对于 Direct ...

  2. H3C用Telnet登录

  3. JQuery---高级选择器

    一.派生选择器 例如:$('#bavBar  a') 二.孩子选择器 例如:$('body > p') 三.相邻兄弟选择器 例如:$('h2 + div') 四.属性选择器 1.$('img[a ...

  4. ifram子页面与父页面的方法相互调用

    parent.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...

  5. "?:"在正则表达式中什么意思

    “?:”非获取匹配,匹配冒号后的内容但不获取匹配结果,不进行存储供以后使用. 单独的“?”:匹配前面的子表达式零次或一次. 当“?”紧跟在任何一个其他限制符(*,+,?,{n},{n,},{n,m}) ...

  6. TabHost选项卡的实现（一）：使用TabActivity实现

    一. TabHost的基本开发流程 TabHost是一种非常实用的组件,可以很方便的在窗口上防止多个标签页,每个标签页相当于获得了一个外部容器相同大小的组件摆放区域. 我们熟悉的手机电话系统" ...

  7. Codeforces Round #174 (Div. 1 + Div. 2)

    A. Cows and Primitive Roots 暴力. B. Cows and Poker Game 模拟. C. Cows and Sequence 线段树维护. D. Cow Progra ...

  8. iptables一个包过滤防火墙实例

    环境:redhat9 加载了string time等模块 eth0 接外网──ppp0 eth1 接内网──192.168.0.0/24 #!/bin/sh # modprobe ipt_MASQUE ...

  9. mysql 第二课 DML操作

    DML 数据操纵语句:INSERT UPDATE DELETE SELECT 主要用来对数据库的数据进行一些操作; DCL 数据定义语句:CREATE ALTER DROP  主要是用在定义或改变表的 ...

  10. HDU 1024 Max Sum Plus Plus (动态规划 最大M字段和)

    Problem Description Now I think you have got an AC in Ignatius.L's "Max Sum" problem. To b ...