Esri Leaflet示例索引及说明
目录
本文对Esri Leaflet 网站上的例子进行了整理,加了一些简要的说明,方便需要时查阅。原文地址:http://esri.github.io/esri-leaflet/examples/
基础底图
- 显示ArcGIS底图
- 带标签的底图:除了底图之外,另外添加一个标签图层
- 底图切换
- 高清底图:用detectRetina 显示高清底图,本例中底图高清显示,标签常规分辨率显示
- 矢量底图:用 L.esri.Vector 插件显示矢量图层
要素图层L.esri.featureLayer
- 简单要素图层:用L.esri.featureLayer 定义要素图层
- 指定点图层样式:用
L.Icon
自定义样式 - 指定线图层样式:用style选项指定线型,具体可参照 featureLayer 定义
- 指定面图层样式:同线图层一样,用 style 选项
- 自定义弹出窗口
- 查询要素#1:通过指定交通站点的方向过滤要素,返回的是GeoJson的数据集
- 查询要素#2:查询某公交站点附近500米范围内的所有要素
featureLayer.query()
.nearby(e.latlng, 500)
.ids(function(error, ids){
for (var j = 0; j < previousIds.length; j++) {
stops.resetStyle(previousIds[j]);
}
- 空间查询:比如可以查询点是否在多边形内,线与多边形的交集等。
neighborhoods.query()
//这里的relationship.value表示空间操作,可以是within,contains,intersects,overlaps等。
//inputGeometry表示操作范围。
[relationship.value](inputGeometry)
.ids(function(error, ids){
previousIds = ids;
for (var i = ids.length - 1; i >= 0; i--) {
neighborhoods.setFeatureStyle(ids[i], { color: 'red', weight: 2 });
};
});
- 简化复杂要素:在服务器上简化复杂的要素以获得更快的响应时间,可用于放大和查看高分辨率的矢量数据时。比如本例中当鼠标浮动到某个多边形上时,高亮显示多边形。定义图层时用simplifyFactor表示简化参数,数值越大,显示性能更好,数值越小表示更精确。
- 缩放到所有要素#1:将地图缩放到某一个边界范围内
featureLayer.query()
.bounds(function (error, latlngbounds) {
map.fitBounds(latlngbounds);
});
// 取回所有数据的响应函数
fl.once("load", function(evt) {
// 创建一个Leaflet边框数据
var bounds = L.latLngBounds([]);
// 遍历要素,将要素的外包矩形逐一添加到上述的边框数据中
fl.eachFeature(function(layer) {
// 获得单个要素的外包矩形
var layerBounds = layer.getBounds();
// 扩展数据集的边框
bounds.extend(layerBounds);
});
// 最后,缩放到选中数据集的范围
map.fitBounds(bounds);
- 标注、标记要素:在要素的中间添加静态文本标签L.marker(通过给定一个地理坐标和一个具有选项的对象来实例化一个注记),注意这个和动态标签不相同,缩小地图时标签会碰撞到一起。
- 图层排序
- 编辑要素: 通过插件 Leaflet.Editable 实现。
要素图层插件
- 生成热力图:通过插件L.heat 实现点生成热力图,直接构建L.esri.Heat.featureLayer图层。
- 渲染热力图:通过插件L.heat 实现,options选项设置重绘样式。
- 时间过滤:通过设置时间过滤要素
- 点聚合:要素图层与Leaflet.markercluster的集成,构建了一个L.esri.Cluster.FeatureLayer 图层。(因为对leaflet.markercluster.js的额外依赖,不需加载L.esri.Cluster.FeatureLayer.js)
- 渲染点聚合:用
L.DivIcon
和L.MarkerCluster
选项自定义聚合样式。
切片图层
动态图层 L.esri.DynamicMapLayer
动态地图服务和切片数据不同,渲染方式是在用户发出请求后在客户端动态绘制的,可以动态修改每个图层的样式,可以执行属性查询、空间查询等操作。
- 简单动态图层:显示地图服务,当加载的地图服务的坐标参考系与本地不同时,会自动进行动态投影。
- 识别要素:本例展示点击识别土地调查数据。
- 自定义弹出窗口:本例展示的是一个野火危险系统的图层。
- 多时相的动态图层:通过设定时间过滤图层。
影像图层 L.esri.ImageMapLayer
- 简单影像地图图层:通过 L.esri.ImageMapLayer加载ArcGIS Server或ArcGIS Online上的影像。
- 渲染规则:动态渲染栅格数据集,渲染规则可由一个预先定义好的raster function设置。本例将原始的LIDAR数据渲染成山体阴影
- 识别影像:通过L.esri.IdentifyImage获取影像特定位置的像素值,本例是加州的DEM模型数据,通过点击返回其海拔。
- 镶嵌规则:用镶嵌规则(点击查看镶嵌规则)动态控制栅格影像,本例表示显示Raster8的世界温度。
- 自定义弹出窗口:点击显示RGB值,identifyResults.pixel.properties.value。
- 多时相影像:通过定义 L.esri.imageMapLayer 的 from 和 to 参数,选取了从1990年到2010年的Landsat432的影像进行展示。
非墨卡托投影
- 要素图层:用 L.esri.TiledMapLayer 和 Proj4Leaflet 插件使用非墨卡托投影的切片数据。风险自担,Esri Leaflet只支持墨卡托参考椭球(WKID 102100/3857),需要对投影、空间参考、切片方式有很深的了解。
- 动态图层:
查询
- 加载要素图层的快照
- 未加载地图也可以查询:执行空间查询时并不需要加载地图,更多信息可以查看L.esri.Query。
认证
- ArcGIS Online认证OAuth 2.0
- 访问ArcGIS Online内容:访问Esri托管的内容时,需要传一个token
- 用户名/密码的方式访问ArcGIS 服务
地理编码 Esri Leaflet Geocoder
- 地理编码控制:用插件 Esri Leaflet Geocoder 实现,一般可用于路径搜索时,坐标与地名相互之间的转换。
- 查找地图服务:插件 Esri Leaflet Geocoder 实现。
- 查找要素图层:基于插件L.esri.Geocoder实现,一般可用于路径搜索时,坐标与地名相互之间的转换。
- 居中初始化地图:基于插件L.esri.Geocoder实现,一般可用于路径搜索时,坐标与地名相互之间的转换。
- 地理反编码:geocodeService.reverse().latlng(e.latlng)
其他插件
- 服务器边渲染:用插件Esri.Leaflet.Renderers实现客户端自动重新符号化要素。
- 流图层、流服务:基于esri-leaflet-stream实现L.esri.streamFeatureLayer,使用WebSocket从服务器获取流数据。更多信息查阅 实时数据源和分析。
- 加载网络地图: 由L.esri.webMap插件实现,ArcGIS Web地图的定义可以参考Web 地图。
- 地理处理:基于插件Esri Leaflet GP实现,提供的功能包括:计算行驶时间、生成高程剖面、最短路径分析、车辆路径问题等。
杂项
- 控制图层:使用Leaflet的Control来控制图层的显示 Control.Layers
- Turf.js:融合第三方库,这样就可以在客户端很好的进行空间分析操作。
- 获取服务元数据:featureLayer.metadata(),可以获取要素图层的名称、外包矩形,及具有的能力或功能。
- 解析要素数据集:将arcgis格式的要素数据转为GeoJSON格式,通过L.esri.Util.arcgisToGeoJSON实现。最后可以通过L.geoJSON 进行展示。
- 室内地图
转载自:https://blog.csdn.net/meizi454089902/article/details/81316996