Leaflet加载geowebcache的WMTS服务

方法1:leaflet.TileLayer.WMTS插件

插件地址https://github.com/alexandre-melard/leaflet.TileLayer.WMTS
用法示例https://hanbo.blog.csdn.net/article/details/80768710
我的示例代码

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title data-i18n="resources.title_wmtsLayer"></title><script type="text/javascript" src="../js/include-web.js"></script>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
<script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
<script src="../js/leaflet-tilelayer-wmts.js"></script>
<script type="text/javascript">var map = L.map('map', {attributionControl: false,logoControl: false,center: [0, 0],zoom: 1,minZoom: 0,maxZoom: 18,crs: L.CRS.EPSG4326,});//设置坐标系左上角坐标,3857坐标系可以默认不用设置,插件里已默认带有const matrixIds = [];for (let i = 0; i < 19; ++i) {matrixIds[i] = {identifier: "" + i,topLeftCorner: new L.LatLng(90, -180)};}var ign = new L.TileLayer.WMTS('http://localhost:8090/geowebcache/service/wmts',{layer: "arcgis_com",style: "",tilematrixSet: "EPSG:4326_arcgis_com",format: "image/jpeg",minZoom: 0,maxZoom: 5,matrixIds: matrixIds,attribution: "<a href='https://github.com/mylen/leaflet.TileLayer.WMTS'>GitHub</a>&copy; <a href='http://www.ign.fr'>IGN</a>"});map.addLayer(ign);
</script>
</body>
</html>

其他方法

leaflet管网用其他插件或者esri-leaflet插件。

OpenLayers加载geowebcache的WMTS服务

https://blog.csdn.net/weixin_40184249/article/details/84615192

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/3328.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【C++】117 填充每个节点的下一个右侧结点指针

给定一个二叉树&#xff1a; struct Node { int val; Node *left; Node *right; Node *next; } 填充它的每个 next 指针&#xff0c;让这个指针指向其下一个右侧节点。如果找不到下一个右侧节点&#xff0c;则将 next 指针设置为 NULL 。 初始状态下&#xff0c;所有 next 指…

统一SQL 支持Oracle cast函数转换

统一SQL介绍 https://www.light-pg.com/docs/LTSQL/current/index.html 源和目标 源数据库&#xff1a;Oracle 目标数据库&#xff1a;Postgresql&#xff0c;TDSQL-MySQL&#xff0c;达梦8&#xff0c;LightDB-Oracle 操作目标 在Oracle中&#xff0c;cast函数允许将一种…

yolov8 区域声光报警+计数

yolov8 区域报警计数 1. 基础2. 报警功能2. 1声音报警代码2. 2画面显示报警代码 3. 完整代码4. 源码 1. 基础 本项目是在 yolov8 区域多类别计数 的基础上实现的&#xff0c;具体区域计数原理可见上边文章 2. 报警功能 设置一个区域region_points&#xff0c;当行人这一类别…

XiaodiSec day028 Learn Note 小迪安全学习笔记

XiaodiSec day028 Learn Note 小迪安全学习笔记 记录得比较凌乱&#xff0c;不尽详细 day 28 还是 sql 注入 知识点 提交方式的注入 在 php, spring boot, flask 都有相关的提交方式 提交方式的注入 数据以某种方式提交到后端 数据大小和数据类型和提交方式有关 如身份…

链栈的基本操作(c语言实现)

栈的概念 栈&#xff1a;一种特殊的线性表&#xff0c;其只允许在固定的一端进行插入和删除元素操作。进行数据插入和删除操作的一端称为栈顶&#xff0c;另一端称为栈底。栈中的数据元素遵守后进先出LIFO&#xff08;Last In First Out&#xff09;的原则。 栈的结构 定义栈…

【JAVA】503.下一个更大元素II | 42. 接雨水 | 84.柱状图中最大的矩形

class Solution {public int[] nextGreaterElements(int[] nums) {int len nums.length;int[] res new int[len];Deque<Integer> stack new LinkedList<>();Arrays.fill(res,-1);for(int i 0 ;i<len*2; i){//循环数用取模的方式int j i % len;while(!stack…

JVM虚拟机监控及性能调优实战

目录 jvisualvm介绍 1. jvisualvm是JDK自带的可以远程监控内存&#xff0c;跟踪垃圾回收&#xff0c;执行时内存&#xff0c;CPU/线程分析&#xff0c;生成堆快照等的工具。 2. jvisualvm是从JDK1.6开始被继承到JDK中的。jvisualvm使用 jvisualvm监控远程服务器 开启远程监控…

C#参数修饰符params

C#参数修饰符params params 关键字允许在 C# 中指定一个方法参数&#xff0c;该参数接受可变数量的参数。这意味着你可以传递一个由指定类型的参数组成的逗号分隔的列表&#xff0c;编译器会将它们打包成一个数组。 示例 : using System;class Program {static void Main(st…

智能家居—ESP32开发环境搭建

相关文章 毕业设计——基于ESP32的智能家居系统(语音识别、APP控制) 智能家居—ESP32开发环境搭建 一、下载安装二、验证三、资料获取 一、下载安装 下载安装 vscode 安装插件 创建工程 二、验证 写一个简单的函数来验证一下功能 void setup() {// put your setup c…

SpringMVC笔记——SpringMVC基础Tomcat环境配置

Tomcat安装配置 下载Apache Tomcat 进入官网https://tomcat.apache.org/&#xff0c;选择tomcat 9 这边使用idea开发&#xff0c;建议直接下载压缩包 无法访问下载的可以直接用我的下载链接&#xff1a;https://cloudreve.zxbdwy.online/s/6nSA 提取码&#xff1a;w1pwk3将压…

婚姻情感 20

婚姻情感 20 怎么和异性聊天&#xff1f;1. 第一步&#xff1a;判断关系2. 第二步&#xff1a;适应状态3. 第三步&#xff1a;信号识别4. 第四步&#xff1a;反应判断5. 第五步&#xff1a;深层控制6. 第六步&#xff1a;复盘定局7. 第七步&#xff1a;破局操控场景描述 怎么和…

【Java并发知识总结 | 第七篇】Java并发相关概念总结(程序/进程/线程、并行/并发、同步/异步、死锁/避免、线程安全/三大特性)

文章目录 7.并发相关概念总结&#xff08;程序/进程/线程、并行/并发、同步/异步、死锁/避免、线程安全/三大特性&#xff09;7.1程序、进程与线程7.2并行和并发7.3同步和异步7.4什么是死锁&#xff1f;如何避免&#xff1f;7.5何为线程安全&#xff1f;以及三大特性 7.并发相关…

java多线程-并发和并行

进程 并发 进程中的线程是由CPU进行调度的&#xff0c;但是CPU能够处理的进程数量有限为了保证所有的线程都在运行&#xff0c;CPU会快速切换&#xff0c;给外界的感觉就是所有的线程都在运行&#xff0c;这就是并发。 并行

【毕设绝技】基于 SpringCloud 的在线交易平台商城的设计与实现(一)

毕业设计是每个大学生的困扰&#xff0c;让毕设绝技带你走出低谷迎来希望&#xff01; 基于 SpringCloud 的在线交易平台商城的设计与实现 一、摘 要 随着互联网的快速发展&#xff0c;人们对商品经济的消费和思考不再停留在传统的经济模式上&#xff0c;网上购物商城是企业与…

安卓手机APP开发__媒体开发部分__常见问题答疑解惑

安卓手机APP开发__媒体开发部分__常见问题答疑解惑 目录 1.修复"Cleartext HTTP traffic not permitted"错误 2.修复"SSLHandshakeException", "CertPathValidatorException" 和 "ERR_CERT_AUTHORITY_INVALID" 错误 3.为什么一些媒…

vue3第二十三节(全局属性方法应用)

vue2 与 vue3 的全局属性使用方法区别 1、globalProperties getcurrentinstace vue3 中已经移除对外暴露 getcurrentinstace,建议使用下面两种 2、provide | inject 3、mitt 事件总线程 1、vue2 通过 prototype 实例上挂载属性/方法,用于全局调用 // main.js import Vue from…

C语言入门课程学习记录4

C语言入门课程学习记录4 第18课 - signed 与 unsigned第19课 - 再论数据类型第20课 - 经典问题剖析第21课 - 程序中的辅助语句&#xff08;上&#xff09;第22课 - 程序中的辅助语句&#xff08;下&#xff09; 本文学习自狄泰软件学院 唐佐林老师的 C语言入门课程&#xff0c;…

git submudles 代码如果提交到一个ID 上

要将git submudles代码提交到一个ID上&#xff0c;可以按照以下步骤进行操作&#xff1a; 1. 确保已将本地仓库更新到远程仓库最新版本&#xff0c;避免提交出现冲突。 2. 进入子模块目录&#xff0c;进行添加、修改等操作&#xff0c;并使用git add暂存更改。 3. 使用git c…

pytest教程-30-测试数据管理插件-pytest-datadir

领取资料&#xff0c;咨询答疑&#xff0c;请➕wei: June__Go 上一小节我们学习了pytest重复执行用例插件pytest-repeat&#xff0c;本小节我们讲解一下测试数据管理插件-pytest-datadir。 在软件测试中&#xff0c;有效管理测试数据对于编写全面的测试用例至关重要。Pytest…

vue基础教程(7)——构建项目级首页

同学们可以私信我加入学习群&#xff01; 正文开始 前言一、页面结构二、侧边栏三、主体部分总结 前言 前面我们学习了vue的路由和登录页搭建&#xff0c;本文将和大家共同学习首页的搭建。 首页示例如图&#xff1a; 很多项目经验比较少的同学&#xff0c;一般都是对某些语…