Leaflet 是一个非常小巧灵活的 Geo js 库，esri 本身也在 Github 上有 leaflet 的相关项目。但是 leaflet 本身支持 Web Mercator Auxiliary Sphere tiling scheme，无法直接加载 arcgis server 发布的图层缓存，需要通过 Proj4 这个库进行转换，这里涉及了投影的相关转换配置，可是没有相关专业知识怎么配置呀，不过只要会搜，一切都是可以的。

以下是具体的步骤：

1. 打开 ArcGIS 的 MapServer，例如 http://[arcgisserver]/ArcGIS/rest/services/TileMAP/MapServer，查看 "Tile info"：记下来所有的 Levels 中的 Resolution

以及下面的 Origin，备用。

2. 继续往下看，记住 Spatial Reference 后的数字。

然后到 "http://spatialreference.org/ref/epsg/[刚刚的数字]/proj4/"

复制内容：“+proj=tmerc +lat_0=0 +lon_0=117 +k=1 +x_0=500000 +y_0=0 +a=6378140 +b=6356755.288157528 +units=m +no_defs”，备用

2. 下载 leaflet, proj4js, proj4leaflet

3. 运行以下代码，注意资源引用位置

  1. <html>
  2. <head>
  3.   <meta charset=utf-8 />
  4.   <title>Esri Leaflet Quickstart</title>
  5.   <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
  6.   <link rel="stylesheet" href="leaflet/leaflet.css" />
  7.   <script src="leaflet/leaflet-src.js"></script>
  8.   <script src="leaflet/proj4.js"></script>
  9.   <script src="leaflet/proj4leaflet.js"></script>
  10.   <style>
  11.     body { margin:0; padding:0; }
  12.     #map { position: absolute; top:0; bottom:0; right:0; left:0; }
  13.   </style>
  14. </head>
  15. <body>
  16.  
  17. <div id="map"></div>
  18.  
  19. <script>
  20.   var centerPoint = new L.LatLng(39.13, 117.20); // 设置地图中心
  21.  
  22.   var crs = new L.Proj.CRS("EPSG:2384", "+proj=tmerc +lat_0=0 +lon_0=117 +k=1 +x_0=500000 +y_0=0 +a=6378140 +b=6356755.288157528 +units=m +no_defs",
  23.   {
  24.     origin: [ [精度偏移], [维度偏移] ],  // 将刚刚的 Origin 复制到这里
  25.     resolutions: [                 // 所有的分辨率复制到这里
  26.       264.583862501058,
  27.       132.291931250529,
  28.       66.1459656252646,
  29.       33.0729828126323,
  30.       16.9333672000677,
  31.       8.46668360003387,
  32.       4.23334180001693,
  33.       2.11667090000847,
  34.       1.05833545000423,
  35.       0.529167725002117,
  36.       0.264583862501058,
  37.       0.132291931250529
  38.     ]
  39.   });
  40.   var mapOptions = {
  41.     center: centerPoint,
  42.     zoom: 1,
  43.     crs: crs,
  44.     attributionControl: true,
  45.   };
  46.   var map = L.map('map', mapOptions);
  47.   var tileLayer = new L.TileLayer('http://[arcgisserver]/ArcGIS/rest/services/TileMAP/MapServer/tile/{z}/{y}/{x}');
  48.   map.addLayer(tileLayer);
  49. </script>
  50.  
  51. </body>
  52. </html>   

4. 完工~~~，之后还可以引用 ersi-leaflet，添加 FeatureLayer 等等，这些有机会再说啦。

使用 Leaflet 显示 ArcGIS 生成西安80坐标的地图缓存的更多相关文章

  1. WGS84经纬度坐标与北京54坐标或者西安80坐标的关系

    一般来讲,GPS直接提供的坐标(B,L,H)是1984年世界大地坐标系(WordGeodetic System 1984即WGS-84)的坐标,其中B为纬度,L为经度,H为大地高即是到WGS-84椭球 ...

  2. ArcGIS中的北京54和西安80投影坐标系详解

    ArcGIS中的北京54和西安80投影坐标系详解 1.首先理解地理坐标系(Geographic coordinate system),Geographic coordinate system直译为地理 ...

  3. ArcGIS Engine 下投影坐标和经纬度坐标的相互转换

    ArcGIS Engine 下投影坐标和经纬度坐标的相互转换 投影转经纬度 ); pPoint.Project(pSRF.CreateGeographicCoordinateSystem((int)e ...

  4. arcgis server账号需要设置地图缓存的访问权限

    如果gis服务起不来,那么可以看看arcgis server账号有没有设置地图缓存的访问权限,有可能arcgis server账号没有这个文件夹的访问权限.  本文用菊子曰发布

  5. CGJ02、BD09、西安80、北京54、CGCS2000常用坐标系详解

    一.万能地图下载器中的常用坐标系 水经注万能地图下载器中的常用的坐标系主要包括WGS84经纬度投影.WGS84 Web 墨卡托投影.WGS84 UTM 投影.北京54高斯投影.西安80高斯投影.CGC ...

  6. [转]地理投影，常用坐标系详解、WGS84、WGS84 Web墨卡托、WGS84 UTM、北京54坐标系、西安80坐标系、CGCS2000坐标系

    转自:http://www.rivermap.cn/docs/show-1829.html 常用坐标系详解 (一)WGS84坐标系 WGS-84坐标系(World Geodetic System一19 ...

  7. 使用ArcGIS实现WGS84经纬度坐标到北京54高斯投影坐标的转换

    [摘 要] 本文针对从事测绘工作者普遍遇到的坐标转换问题,简要介绍ArcGIS实现WGS84经纬度坐标到北京54高斯投影坐标转换原理和步骤. [关键词] ArcGIS 坐标转换 投影变换 1 坐标转换 ...

  8. 我国三大常用坐标系：北京54、西安80和WGS－84

    转自:http://blog.sina.com.cn/s/blog_6dbe2d780100mwr5.html 我国三大常用坐标系:北京54.西安80和WGS-84 1.北京54坐标系(BJZ54)北 ...

  9. 我国三大坐标系的区别（西安80、北京54、WGS-84）

    1.北京54坐标系(BJZ54) 北京54坐标系为参心大地坐标系,大地上的一点可用经度L54.纬度M54和大地高H54定位,它是以克拉索夫斯基椭球为基础,经局部平差后产生的坐标系. 1954年北京坐标 ...

随机推荐

  1. centos7启动顺序加密的问题

    在上一篇博客中我们说的是如何进入单用户模式,这篇我主要来讲centos7启动加密. 首先我们来说centos的启动顺序: 上一篇我们所说的进入单用户模式,就是在boot loader 这一层次下进入的 ...

  2. HTML 遍历

    HTML 遍历 HTML基本格式: 1.下行遍历: 属性 说明 contents 子节点的列表,将所有儿子节点存入列表 children 子节点的迭代类型,与.contents类似,用于循环遍历儿子节 ...

  3. Java多线程——死锁

    当一个线程永远地持有一个锁,并且其他线程都尝试获得这个锁时,那么他永远被阻塞,当线程A持有锁L并想获得锁M的同时,线程B持有锁M并同时尝试获得锁L时,那么两个线程将永远的等待下去,这中情况就是简单的死 ...

  4. 课程一(Neural Networks and Deep Learning)，第一周（Introduction to Deep Learning）—— 2、10个测验题

    1.What does the analogy “AI is the new electricity” refer to?  (B) A. Through the “smart grid”, AI i ...

  5. (转)http://blog.csdn.net/renfufei/article/details/38474435

    原文:http://blog.csdn.net/renfufei/article/details/38474435

  6. C++的开源跨平台日志库glog学习研究(一)

    作为C++领域中为数不多的好用.高效的.跨平台的日志工具,Google的开源日志库glog也算是凤毛麟角了.glog 是一个C++实现的应用级日志记录框架,提供了C++风格的流操作. 恰巧趁着五一我也 ...

  7. Vue-router的基本使用

    Vue-router的基本使用 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  8. java 算法 - 冒泡排序

    冒泡排序: 冒泡排序是专门针对已有的一部分已经排序的数据进行排序的一种排序算法.假如你的数据中只有两个数据输乱序的,那么冒泡排序就是最快的.这种算法的核心思想就是扫描数据清单,找到乱序中相邻的两个数据 ...

  9. golang-nsq消息队列应用

    1. 安装nsq brew install nsq 2.启动nsq https://nsq.io/overview/quick_start.html 3.golang client var produ ...

  10. freepbx对接gms网关

    前面的文章阿里云使用镜像安装freepbx , 安装freepbx后创建sip分机 ,freepbx的SIP通话客户端X-lite Yate eyeBeam Linphone我们已经成功的创建好了分机 ...