使用openlayers加载本地离线地图瓦片的一个最简单地例子_openlayer加载离线地图-程序员宅基地

上一篇文章写了 leaflet，本篇说一下openlayers。

第一步，下载：

https://github.com/openlayers/openlayers/releases/download/v6.2.1/v6.2.1-dist.zip

解压后，我们只需要其中两个文件ol.css，ol.js

第二步，下载瓦片，参考上篇文章，https://blog.csdn.net/netying/article/details/105187665

本文不再赘述。

第三步：编写html文件

<html>
<head>
<link rel="stylesheet" href="./ol.css" type="text/css">
<style>
html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;}
.map{height:100%px;width:100%;}
</style>
<script src="./ol.js"></script>
<title>OpenLayers example</title>
</head>
<body>
<div id="map" class="map"></div>
<script type="text/javascript">
var center=ol.proj.transform([110.5,29.5],'EPSG:4326','EPSG:3857');
var map=new ol.Map({view:new ol.View({center:center,zoom:10,minZoom:9,maxZoom:12}),target:'map'});
var offlineMapLayer=new ol.layer.Tile({source:new ol.source.XYZ({url:'./test/{z}/{x}/{y}.jpg'})});
map.addLayer(offlineMapLayer);
</script>
</body>
</html>

同样，我们保存其为index.html,保存在c:\offlinemaps目录下，也就是与test目录在同一级目录下。

ol.css和ol.js两个解压缩后的文件也保存到index.html的同目录下。

第四步：双击index.html，即可看到地图成功加载！

本文链接：https://blog.csdn.net/netying/article/details/105211134

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

android 陀螺仪简单使用，判读手机是否静止状态_安卓陀螺仪多少才算静止-程序员宅基地

文章浏览阅读6.5k次，点赞5次，收藏13次。陀螺仪允许您在任何给定时刻确定Android设备的角速度。简单来说，它告诉您设备绕X，Y和Z轴旋转的速度有多快。最近，即使是预算手机正在制造，陀螺仪内置，增强现实和虚拟现实应用程序变得如此受欢迎。通过使用陀螺仪，您可以开发可以响应设备方向的微小更改的应用程序。创建陀螺仪对象和管理器manager// Register it, specifying the polling interv..._安卓陀螺仪多少才算静止

lib静态库逆向分析_libtersafe-程序员宅基地

文章浏览阅读4.7k次，点赞3次，收藏16次。当我们要分析一个lib库里的代码时，首先需要判断这是一个静态库还是一个导入库。库类型判断lib文件其实是一个压缩文件。我们可以直接使用7z打开lib文件，以查看里面的内容。如果里面的内容是obj文件，表明是静态库。如果里面的内容是dll文件，表明是导入库。导入库里面是不包含代码的，代码包含在对应的dll文件中。从lib中提取obj静态库是一个或者多个obj文件的打包，这里有两个方法从中提取obj：Microsoft 库管理器 7z解压Microsoft 库管理器(li_libtersafe

Linux的网络适配器_linux 查询网络适配器-程序员宅基地

文章浏览阅读5.3k次，点赞3次，收藏3次。了解一下，省的脑壳痛桥接模式对应的虚拟网络名称“VMnet0” 桥接模式下，虚拟机通过主机的网卡进行通信，若物理主机有多块网卡（有线的和无线网卡），应选择桥结哪块物理网卡桥接模式下，虚拟机和物理主机同等地位，可以通过物理主机的网卡访问外网（局域网），一个局域网的其他计算机可以访问虚拟机。为虚拟机设置一个与物理网卡在同个网段的IP，则虚拟机就可以与物理主机以及局域..._linux 查询网络适配器

【1+X Web前端等级考证】 | Web前端开发中级理论 (附答案)_1+xweb前端开发中级-程序员宅基地

文章浏览阅读3.4w次，点赞77次，收藏438次。# 前言2020 12月 1+X Web 前端开发中级模拟题大致就更这么多,我的重心不在这里,就不花太多时间在这里面了。但是，说说1+X Web前端开发等级考证这个证书,总有人跑到网上问：这个证书有没有用？这个证书含金量高不高？# 关于考不考因为这个是工信部从2019年才开始实施试点的，目前还在各大院校试点中，就目前情况来看，知名度并不是很高，有没有用现在无法一锤定音，看它以后办的怎么样把，软考以前也是慢慢地才知名起来。能考就考吧，据所知，大部分学校报考，基本不用交什么报考费(小部分学校，个别除._1+xweb前端开发中级

Linux安装mysql8.0（官方教程！）-程序员宅基地

文章浏览阅读2.5w次，点赞46次，收藏345次。Linux安装mysql（官方教程！）_linux安装mysql8.0

win10微软账号登陆报错：0x80190001解决方案_微软账户登录0x8019001-程序员宅基地

文章浏览阅读3.5w次，点赞19次，收藏18次。win10微软账号登陆报错：0x80190001解决方案_微软账户登录0x8019001