首先看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. 利用mock生成随机的东西

    Mock.mock({ "list|100": [ { 'id|+1': 1,//id排列 'color': '@color()',//随机颜色 'date': '@datetim ...

  2. [C#] 查标准正态分布表

    C#里面要计算正态分布是一件比较麻烦的事情,一般是通过查表来实现的. static double[] ayZTFB = null; /// <summary> /// 计算标准正态分布表 ...

  3. vue4——把输入框的内容添加到页面（简单留言板）

    文章地址:https://www.cnblogs.com/sandraryan/ vue最最最简单的demo(记得引入) 实例化一个vue,绑定#app的元素,要渲染的数组arr作为data. 把ar ...

  4. Jieba分词包（一）——解析主函数cut

    1. 解析主函数cut Jieba分词包的主函数在jieba文件夹下的__init__.py中,在这个py文件中有个cut的函数,这个就是控制着整个jieba分词包的主函数.    cut函数的定义如 ...

  5. halcon坐标转换（机器人坐标转换用）

    #图像坐标r:=[431, 355, 507, 53, 507]c:=[505, 543, 316, 127, 883]#物理坐标(例如机器人坐标)r1:=[0, 2.0, -2.0, 10, -2. ...

  6. lavarel 响应宏

    宏的概念 计算机里的宏是批量处理的意思.比如我们在进行文本编辑的时候,打错字会有回退的功能——control+z:但是这是我们的键盘操作,计算机在进行处理的时候是不能理解的,他必须对最近两次操作进行比 ...

  7. 教你如何成为Spark大数据高手？

    教你如何成为Spark大数据高手? Spark目前被越来越多的企业使用,和Hadoop一样,Spark也是以作业的形式向集群提交任务,那么如何成为Spark大数据高手?下面就来个深度教程. Spark ...

  8. POJ 1321 深搜dfs

    思路其实挺简单的,为什么我想不到呢!!! 原因分析:(1)题目还是做少了 (2)做题目的时候在放音乐 (3)最近脑袋都不愿意想思路总是想一些无用的 改进:(1)以后做题目坚决不开音乐,QQ直接挂隐身 ...

  9. java spring使用Jackson过滤

    一.问题的提出. 项目使用Spring MVC框架,并用jackson库处理JSON和POJO的转换.在POJO转化成JSON时,希望动态的过滤掉对象的某些属性.所谓动态,是指的运行时,不同的cont ...

  10. 2018-8-10-win10-uwp-使用-Geometry-resources-在-xaml

    title author date CreateTime categories win10 uwp 使用 Geometry resources 在 xaml lindexi 2018-08-10 19 ...