加载arcgis server的rest服务瓦片数据ol.layer.Tile+ol.source.TileArcGISRest

加载arcgis online的在线瓦片数据ol.layer.Tile+ol.source.XYZ

加载arcgis server的rest服务矢量数据ol.layer.Vector+ol.source.Vector

上图所示是server的服务瓦片数据。

1、加载arcgis的服务瓦片数据:要注意将js写在地图标签的后面才能生效,不然地图出不来

var map = new ol.Map({

  target:"mapDiv",

  view:new ol.View({

    center:[0,0],

    zoom:5  //初始化的中心点是缩放

  })

});

var arcgisSource = new ol.source.TileArcGISRest({

  url:"http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer"

});

var arcgisLayer = new ol.layer.Tile({

  source:arcgisSource,

  extent:[-13884991,2870341,-7455066,6338219]

});

map.addLayer(arcgisLayer);

setMapView([-10997148, 4569099],5);

function setMapView(center,zoom){

  var view = map.getView();

  view.setCenter(center);

  view.setZoom(zoom);

}

<div id="mapDiv"></div>

2、加载arcgis online的在线瓦片数据

var arcgisSource = new ol.source.XYZ({

  attributions:new ol.Attribution({

    html:'Tiles &copy; <a href="http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer">ArcGIS</a>'

  })

  url:"http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}"

});

var arcgisLayer = new ol.layer.Tile({

  source:arcgisSource

});

map.addLayer(arcgisLayer);

setMapView(ol.proj.fromLonLat([-121.1, 47.5]),7);  //坐标转换问题?

3、加载arcgis server的rest服务矢量数据

var serviceUrl = 'http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/' + 'services/PDX_Pedestrian_Districts/FeatureServer/';   //根目录
var layer = '0';  //参数设置
var esrijsonFormat = new ol.format.EsriJSON();  //ESRI的JSON数据格式解析类

//实例化矢量数据源对象(AJAX请求REST服务)
                    var arcGISSource = new ol.source.Vector({
                       loader: function (extent, resolution, projection) {
                          var url = serviceUrl + layer + '/query/?f=json&' +
                             'returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry=' +
                             encodeURIComponent('{"xmin":' + extent[0] + ',"ymin":' +
                                    extent[1] + ',"xmax":' + extent[2] + ',"ymax":' + extent[3] +
                                   ',"spatialReference":{"wkid":102100}}') +
                                '&geometryType=esriGeometryEnvelope&inSR=102100&outFields=*' +
                               '&outSR=102100';
                          $.ajax({

          url: url,

          dataType: 'jsonp',

          success: function (response) {
                                   if (response.error) {
                                       alert(response.error.message + '\n' + response.error.details.join('\n'));
                                  } else {
                                        // 从请求结果中读取要素
                                        var features = esrijsonFormat.readFeatures(response, {
                                            featureProjection: projection
                                        });
                                        if (features.length > 0) {
                                            arcGISSource.addFeatures(features);//将要素设置到数据源中
                                      }
                               }
                           }
                         });
                      },
                      strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
                           tileSize: 512
                      }))
                  });
                 arcGISLayers = new ol.layer.Vector({
                        source: arcGISSource
                 });
                 map.addLayer(arcGISLayers); //添加地图图层  
                 setMapView(ol.proj.fromLonLat([-121.1, 47.5]), 5);

添加ArcGIS数据的更多相关文章

  1. ArcEngine批量添加XY数据

    使用ArcGIS Desktop “添加XY数据”或者“创建XY事件图层”工具 可以导入Excel坐标数据,生成临时图层并添加至ArcMap.ArcGlobe或者ArcScene中.在ArcEngin ...

  2. ArcGIS数据生产与精细化制图之中国年降水量分布图的制作

    原文:ArcGIS数据生产与精细化制图之中国年降水量分布图的制作 楼主按:在今年的Esri中国用户大会上,我听了几场关于ArcGIS用于制图方面的讲座,也在体验区与Esri中国的技术老师有一些交流.一 ...

  3. thinkphp添加空数据的解决办法

    thinkphp真是个麻烦的东西,各种小问题,其中字段映射的表单名不能与数据库的字段名称相同,否则会添加空数据! 还有自动完成的名称要与字段映射后的名称相同,否则自动完成不会起作用! 还有自动验证的字 ...

  4. Python中,添加写入数据到已经存在的Excel的xls文件,即打开excel文件,写入新数据

    背景 Python中,想要打开已经存在的excel的xls文件,然后在最后新的一行的数据. 折腾过程 1.找到了参考资料: writing to existing workbook using xlw ...

  5. “ArcGIS数据应用和地图打印输出

    中国科学院计算技术研究所教育中心 关于开展“ArcGIS数据应用和地图打印输出” 培训班的通知 各相关单位: 随着信息化.网络化.数字化向纵深发展,互联网与空间地理信息系统相互交织,数字地球.“智慧地 ...

  6. 更新ACCESS数据库出现“字段太小而不能接受所要添加的数据的数量。试着插入或粘贴较少的数据。”的解决方法

    今天进行数据调试时出现“字段太小而不能接受所要添加的数据的数量.试着插入或粘贴较少的数据.”,跟踪发现是在更新数据库的数据时出现的. 打开数据库表格发现出错的数据字段类型被定义为“文本”,也就是数据最 ...

  7. 向SDE图层中添加大量数据时,出现ORA-00604以及ORA-01000的解决办法

    转自原文 向SDE图层中添加大量数据时,出现ORA-00604以及ORA-01000的解决办法 写了一个小程序,从一个列表中读取坐标串,每个坐标串生成一个IPolygon,然后将这些Polygon添加 ...

  8. java+ mysql 给所有的表添加假数据

    需求:别的项目, 代码扣过来了, 数据库也拿过来了, 但是数据库全是空表, 一共700 张表,需求是给表添加假数据,让它能运行起来. 一下是代码实现: 1.数据库连接: public static C ...

  9. ASP.NET MVC用存储过程批量添加修改数据

    用Entity Framework 进行数据库交互,在代码里直接用lamda表达式和linq对数据库操作,中间为程序员省去了数据库访问的代码时间,程序员直接可以专注业务逻辑层的编写.但是对于比较复杂的 ...

随机推荐

  1. Type system-Type checking

    类型系统的属性: 1.结构属性: 2.规则属性:类型系统定义了一套规则(内部数据的访问规则.函数的访问规则.类型的比较与转化规则),以供编译和运行时进行检查. In programming langu ...

  2. 第一章 关于python

    Python简介 Python是什么?   python的创始人为吉多·范罗苏姆(Guido van Rossum).  “Python is a great object-oriented, int ...

  3. NOIP2016 DAY1 T3 换教室

    换教室 Description 对于刚上大学的牛牛来说,他面临的第一个问题是如何根据实际情况申请合适的课程.在可以选择的课程中,有2n节 课程安排在n个时间段上.在第i(1≤i≤n)个时间段上,两节内 ...

  4. Maven下Flex国际化配置

    之前写了flashbulid.initellij下的flex国际化配置,它们都是在本地打包发布的,那么我们的工程用maven管理了,需要自动发布.这时候如何修改flex的pom文件,来让它build的 ...

  5. HDU 4253 Two Famous Companies

    Two Famous Companies Time Limit: 15000ms Memory Limit: 32768KB This problem will be judged on HDU. O ...

  6. CodeForces 362E Petya and Pipes

    Petya and Pipes Time Limit: 1000ms Memory Limit: 262144KB This problem will be judged on CodeForces. ...

  7. C/s模式与B/S模式

    C/S模式事是client/server,即客服端/服务模式

  8. HDU——T 2119 Matrix

    http://acm.hdu.edu.cn/showproblem.php?pid=2119 Time Limit: 5000/1000 MS (Java/Others)    Memory Limi ...

  9. [React] Understanding setState in componentDidMount to Measure Elements Without Transient UI State

    In this lesson we'll explore using setState to synchronously update in componentDidMount. This allow ...

  10. Struts2学习(四)利用ajax异步上传

    上一篇说到怎样在struts2中进行上传下载.我们使用了struts的标签通过表单提交的方式,但大家知道表单提交会造成页面总体的刷新,这样的方式很不友好,那我们今天就来说说怎样结合ajax方式进行异步 ...