加载本地地图
<html>
<head>
<metacharset=utf-8/>
<title>IdentifyingFeatures</title>
<metaname='viewport'content='initial-scale=1,maximum-scale=1,user-scalable=no'/> <!--从CDN上引入leaflet的文件-->
<linkrel="stylesheet"href="//cdn.jsdelivr.net/leaflet/0.7.3/leaflet.css"/>
<scriptsrc="//cdn.jsdelivr.net/leaflet/0.7.3/leaflet.js"></script> <!--从CDN上引入Esri的包-->
<scriptsrc="//cdn-geoweb.s3.amazonaws.com/esri-leaflet/1.0.0-rc.6/esri-leaflet.js"></script> <style>
body{margin:0;padding:0;}
#map{position:absolute;top:0;bottom:0;right:0;left:0;}
</style>
</head>
<body> <style>
#selectedFeatures{
position:absolute;
top:10px;
right:10px;
z-index:10;
background:white;
padding:1em;
}
</style> <divid="map"></div>
<script>
varmap=L.map('map').setView([34.03,103.8],13); L.esri.basemapLayer('Gray').addTo(map); varGSAU=L.esri.dynamicMapLayer('http://localhost:6080/arcgis/rest/services/GSAU/20141107NetworkAnalysise/MapServer',{
opacity:0.5,
useCors:false
}).addTo(map); varidentifiedFeature;
map.on('click',function(e){
if(identifiedFeature){
map.removeLayer(identifiedFeature);
}
GSAU.identify().on(map).at(e.latlng).run(function(error,featureCollection){
identifiedFeature=newL.GeoJSON(featureCollection.features[0],{
style:function(){
return{
color:'#5C7DB8',
weight:2
};
}
}).addTo(map);
});
});
</script>
</body>
</html> 这么多的链式函数???不要大惊小怪,通过查看leaflet(Esri)的API可以看到,大多函数返回的都是this.再打开控制台,键入this,奇迹出现了,就是window,是不是明白什么了????

Leaflet(Esri)初识的更多相关文章

  1. leaflet 整合 esri

    此 demo 通过 proj4js 将 leaflet 与 esri 整合起来,同时添加了 ClusteredFeatureLayer 的支持. 下载 <html> <head> ...

  2. Esri的开源JS项目杂谈

    一提到Esri大家首先想到的是庞大的ArcGIS产品大家族,其产品包含从桌面端,到服务器/云端,再到web/移动端.作为一名极客,不聊开源逼格似乎上不去啊.其实,Esri作为一个开放的平台,不仅有稳定 ...

  3. leaflet地图库

    an open-source JavaScript libraryfor mobile-friendly interactive maps Overview Tutorials Docs Downlo ...

  4. esri-leaflet入门教程(1)-leaflet介绍

    esri-leaflet入门教程(1)-esri leaflet介绍 by 李远祥 关于leaflet,可能很多人比较陌生,如果搭上esri几个字母,可能会有更多的人关注.如果没有留意过leaflet ...

  5. leaflet+esri-leaflet+heatmap实现热力图

    1.环境准备 1)下载leaflet.js插件,  官网传送:http://leafletjs.com/ 2)下载esri-leaflet.js插件,  官网传送:http://esri.github ...

  6. R+大地图时代︱ leaflet/leafletCN 动态、交互式绘制地图(遍地代码图)

    好久没有学习R的新包了,甚是想念啊! 昨天.今天看到两个极好.不得不学的packages+早上被AWS的服务器整得郁闷ing-于是就来点颜色看看~ 本篇受Lchiffon老师的github启发,对两个 ...

  7. 【GIS】postgres(postgis) --》nodejs+express --》geojson --》leaflet

    一.基本架构 1.数据存储层:PostgreSQL-9.2.13 + postgis_2_0_pg92 2.业务处理层:Nodejs + Express + PG驱动 3.前端展示层:Leaflet ...

  8. 使用 Leaflet 显示 ArcGIS 生成西安80坐标的地图缓存

    Leaflet 是一个非常小巧灵活的 Geo js 库,esri 本身也在 Github 上有 leaflet 的相关项目.但是 leaflet 本身支持 Web Mercator Auxiliary ...

  9. leaflet实现风场图(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

随机推荐

  1. Codeforces Round #443 (Div. 2) C: Short Program - 位运算

    传送门 题目大意: 输入给出一串位运算,输出一个步数小于等于5的方案,正确即可,不唯一. 题目分析: 英文题的理解真的是各种误差,从头到尾都以为解是唯一的. 根据位运算的性质可以知道: 一连串的位运算 ...

  2. poj1995 Raising Modulo Numbers【高速幂】

    Raising Modulo Numbers Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 5500   Accepted: ...

  3. UITextView的一些事1

    TextView如果只是作为展示文本时,要设置如下属性: //不可编辑(是否弹出键盘) TextView_label.editable=NO; //不可选择(长按不会出现复制.粘贴) TextView ...

  4. NOIP模拟 wall - 最大生成树

    题目大意: 给出n个点,第i个点坐标是(\(x_i, y_i\)),给出m条边,第i条边的权值是\(w_i\),求将图变成一颗树所需要删除边的最小权值和. 题目分析: 首先要看出坐标其实是出题人使出的 ...

  5. 【16.23%】【codeforces 586C】Gennady the Dentist

    time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...

  6. 不安装 oracle的客户,就可以使用pl/sql访问远程oracle 数据库的方法

    免安装Oracle客户端使用PL/SQL连接Oracle      大家都知道,用PL/SQL连接Oracle,是需要安装Oracle客户端软件的.有没要想过不安装Oracle客户端直接连接Oracl ...

  7. 利用WPF建立自己的3d gis软件(非axhost方式)(六)跳转,增加外部三维模型

    原文:利用WPF建立自己的3d gis软件(非axhost方式)(六)跳转,增加外部三维模型 先下载SDK:https://pan.baidu.com/s/1M9kBS6ouUwLfrt0zV0bPe ...

  8. Multiple address space mapping technique for shared memory wherein a processor operates a fault handling routine upon a translator miss

    Virtual addresses from multiple address spaces are translated to real addresses in main memory by ge ...

  9. 聊聊PROFINET与PROFIBUS

    1.PROFINET与PROFIBUS从狭义上比,没有可比性,因为他们的物理接口不同,电气特性,不同,波特率不同,电气介质特性不同等等.这样两者的协议是完全没有关联性的,唯一的关联性就是两者都是PI组 ...

  10. zabbix从听说到学会

    一.zabbix简介 zabbix(音同 zæbix)是一个基于WEB界面的提供分布式系统监视以及网络监视功能的企业级的开源解决方案. zabbix能监视各种网络参数,保证服务器系统的安全运营:并提供 ...