ol3开发离线地图
注意:国内地图均经过加密,尤其是百度地图,经过了二次加密,通常情况下都会存在偏差。所以最好是利用地图下载器下载后面带有“无偏差”的地图,否则需要对经纬度进行转化。
1、需要的前端库文件有jquery.js、ol.js、ol.css。网上百度一番不难找,实在找不到的可以留言我发给你。
2、需要有地图的瓦片图。网上有各类工具:全能电子地图下载器,水经注地图下载器等等,可以免费将百度、谷歌、高德、腾讯等的地图制作成瓦片图后下载下来。同上,百度一番不难找,实在找不到可以留言。
3、首先在body中定义一个div用以存放地图,注意需要设置id
<div id="map" style="width: 80%;height: 80%;"></div>
4、js实现加载地图
第一个参数[111.36,26.25]为地图的中心位置,后面的两个参数是地图的坐标系,ol3默认情况下是3857,我们需要把经纬度从4326转化为3857。这样才不会错位。
var center = ol.proj.transform([111.36, 26.25], 'EPSG:4326', 'EPSG:3857');
设置离线地图的图层。通常我们下载下来的地图都会是类似d://roadmap/z/y/x.png这样的格式,其中zyx为数字,或是数据加一个字母,z代表图层,y代表y轴,x代表x坐标
将下载下来的地图放到项目里面,url设置对应的路径
var offlineMapLayer = new ol.layer.Tile({
source: new ol.source.XYZ({
url: 'roadmap/{z}/{x}/{y}.png'
})
});
ol3中一个完整的地图至少需要3个要素:1、图层layers,可以同时设置多个图层,按照先后顺序进行覆盖;2、中心坐标;3、地图容器
// 创建地图
var map = new ol.Map({
// 设置地图图层
layers: [
offlineMapLayer//将我们上一步设置好的离线地图加载进来
],
// 设置显示地图的视图
view: new ol.View({
//projection: 'EPSG:4326',
center: center, // 将之前定义好的中心点放进来
zoom: 10, //设置地图默认展开到第10个图层,即默认z=10
}),
// 让之前id为map的div作为地图的容器
target: 'map',
});
完成以上步骤,一个最简单的离线地图就完成了。
ol3开发离线地图的更多相关文章
- GIS开发离线地图应用-初识gis
http://www.cnblogs.com/kevin-zlg/p/4611671.html 最新公司需要做一个基于gis地图的应用系统,由于之前公司项目中的电子地图模块都是我开发的,所以这个新系统 ...
- 【BIGEMAP一键离线地图服务】
地址:http://www.bigemap.com/offlinemaps/ 首页 离线地图 代码示例 项目案例 开发文档 关于我们 [BIGEMAP一键离线服务] 1.快速搭建离线地图服务2 ...
- 3D离线地图开发
3D离线地图介绍(3D离线采用矢量数据作为地图基础,可保持地图数据最新) 一.开发中引用3D离线地图(可独立部署通过内外IP+端口进行访问,也可拷贝js库文件到项目中通过绝对路径访问) 1).离线AP ...
- 百度3D离线地图开发,3D离线地图开发,百度地图离线开发
3D离线地图介绍(3D离线采用矢量数据作为地图基础,可保持地图数据最新) 一.开发中引用3D离线地图(可独立部署通过内外IP+端口进行访问,也可拷贝js库文件到项目中通过绝对路径访问) 1).离线AP ...
- Arcgis Android API开发之离线地图
最近一直在倒腾Arcgis Android API等相关的东西,想把自己的做的图放到地图上去,也就是离线地图,穷人一般是没有钱的,一个月好几十的流量是开不起的,所以就左捉摸,右思考,看着API里面有离 ...
- Web GIS 离线地图
Web GIS 离线地图 1,基于瓦片的离线地图下载 博客园 阿凡卢 提供了离线地图的下载工具,下载地址:http://pan.baidu.com/s/1hqvQr7e 具体使用见 参考资料2 阿凡卢 ...
- ArcGIS for Android示例解析之离线地图-----LocalTiledLayer
转自:http://blog.csdn.net/wozaifeiyang0/article/details/7327423 LocalTiledLayer 看到这个标题是否是很激动,如题,该示例就是添 ...
- java离线地图web GIS制作
因为项目需求,要做一个web地图,之前做过高德的在线地图,它提供了一系列的API,并且由于是国产的,所以开发起来比较容易,现在由于项目是内网使用的,所以需要使用离线地图,由此便开始了: Web GIS ...
- Arcgis For Android之离线地图实现的几种方式
为什么要用,我想离线地图的好处是不言而喻的,所以很多人做系统的时候都会考虑用离线地图.在此,我给大家介绍几种Arcgis For Android下加载离线地图的方式. 在Arcgis For Andr ...
随机推荐
- ssh简单入门级案例教程
准备工作:struts2.3.34+spring4.2.2+hibernate3.3.2 导入需要的开发包: struts开发包---注意:javassist-3.18.1-GA.jar包与hiber ...
- 16. 3Sum Closest(双指针)
Given an array nums of n integers and an integer target, find three integers in nums such that the s ...
- 如何让多个dz论坛共用一个用户数据库
用户数据库在论坛中是可以独立备份的,备份方法:论坛后台——站长——数据库,备份所有ucenter数据表,也就是用户数据.其他DZ论坛搭建完成以后,可以上传用户数据库,将备份文件使用上传至网站所使用的主 ...
- win7 64位 python启动报错:无法启动此程序,因为计算机中丢失api-ms-win-crt-process-l1-1-0.dll
安装python3.7,安装成功后,在cmd窗口输入python检查是否安装成功,报错:无法启动此程序,因为计算机中丢失api-ms-win-crt-process-l1-1-0.dll 在网上查询了 ...
- superblock 区块数据读取
鸟哥私房菜笔记: 命令:df -Th Filesystem:代表该文件系统是在哪个 partition ,所以列出设备名称:1k-blocks:说明下面的数字单位是 1KB 呦!可利用 -h 或 -m ...
- 【函数封装】javascript判断移动端操作系统为android 或 ios 或 iphoneX
function isPhone(){ var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.index ...
- flask设置cookie,设置session,模拟用户认证、模拟管理后台admin、模拟用户logout
设置cookie HTTP协议是无状态的,在一次请求响应结束后,服务器不会留下关于客户端状态的信息.但是对于某些web程序来说,客户端的信息有必要被记住,比如用户的登录状态,这样就可以根据用户的状态来 ...
- mongoDB3.4的sharding集群搭建及JavaAPI的简易使用
第一部分 在搭建mongoDB之前,我们要考虑几个小问题: 1.我们搭建集群的目的是什么?是多备份提高容错和系统可用性还是横向拓展存储大规模数据还是两者兼有? 如果是为了多备份那么选择replicat ...
- 文本tfidf
文本分类tf:词的频率 idf:逆文档频率 代码实例: # tf idf from sklearn.feature_extraction.text import TfidfVectorizer imp ...
- python 关键字yield解析
python 关键字yield解析 yield 的作用就是把一个函数变成一个 generator,带有 yield 的函数不再是一个普通函数,Python 解释器会将其视为一个 generator.y ...