ArcGIS Server开发实践之【Search Widget工具查询本地地图服务】
加载本地地图服务,并实现要素的查询。(不足之处还请指点)具体代码如下:
<!DOCTYPE html>
<html dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>利用Search工具搜索要素图层上的要素</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css">
<style>
html,
body,
#map,
.map.container {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
#info {
top: 2px;
color: #444;
height: auto;
font-family: arial;
font-weight: bold;
left: 69px;
margin: 5px;
padding: 10px;
position: absolute;
width: 260px;
z-index: 40;
border: solid 1px #003300;
border-radius: 4px;
background-color: #E5E5E5;
}
#search {
display: block;
position: absolute;
z-index: 2;
top: 70px;
left: 74px;
}
/*Beginning of search box modifications*/
.arcgisSearch .searchClear {
background-color: #E5E5E5;
}
.arcgisSearch .esriIconZoom {
background-image: url("finding.png");
background-size: 20px 20px;
}
.esriIconZoom:before {
content: "";
}
.arcgisSearch .searchGroup .searchInput,
.arcgisSearch .searchBtn,
.arcgisSearch .noResultsMenu,
.arcgisSearch .suggestionsMenu {
border: 1px solid #003300;
background-color: #E5E5E5;
}
.arcgisSearch .noValueText {
color: red;
font-size: 14px;
}
/*Beginning of popup modifications*/
.esriPopup .titlePane {
background-color: #003300;
border-bottom: 1px solid #121310;
font-weight: bold;
}
.esriPopup a {
color: #DAE896;
}
.esriPopup .contentPane,
.esriPopup .actionsPane,
.esriPopup .pointer,
.esriPopup .outerPointer {
background-color: #B3B3B3;
}
</style> <script>
var dojoConfig = {
parseOnLoad: true
};
</script>
<script src="https://js.arcgis.com/3.16/"></script> <script>
var map; require([
"esri/map",
"esri/layers/FeatureLayer",
"esri/dijit/Search",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/InfoTemplate",
"dojo/domReady!"
], function (Map, FeatureLayer, Search,ArcGISDynamicMapServiceLayer, InfoTemplate) {
//添加一个动态图层,可利用本地服务器中的地图服务
var url=ArcGISDynamicMapServiceLayer("http://localhost:6080/arcgis/rest/services/交院地图/MyMapService/MapServer"); map = new Map("map", {
// basemap: "streets",
center: [100, 35], // lon, lat
zoom: 4
});
map.addLayer(url); //ArcGIS Online feature service showing ecological footprints taken from Global FootPrint Network,
//more information on this can be found http://jsapi.maps.arcgis.com/home/item.html?id=0f4c89208dce44b583d9219d843591c3
//添加一个要素图层,用于查询使用。查询要素图上面的属性信息
var layer = new FeatureLayer("http://localhost:6080/arcgis/rest/services/交院地图/MyMapService/MapServer/2", {
outFields: ["*"]
});
map.addLayer(layer); //Create search widget
// //实例化一个搜索部件
var search = new Search({
map: map,
//passing in empty source array to clear defaults such as
//"All" and the ArcGIS Online World Geocoding service
//search的属性
sources: [],
zoomScale: 5000000
}, "search"); //listen for the load event and set the source properties
//箭筒load事件设置源属性
search.on("load", function () { var sources = search.sources;//search的sources属性。源对象数组用于查找搜索结果
sources.push({
featureLayer: layer,
placeholder: "Spain", //用来提示源输入文本
enableLabel: false, //是否在地图上显示一个文本标签,使用labelSymbol选中的源
searchFields: ["name"],// 指定搜索结果的要素层
displayField:"name",//显示正在使用的字段,默认显示第一个图层。 exactMatch: false,//搜索值完全匹配返回结果,一般为false
outFields: ["*"],//指定返回搜索结果的字段 //Create an InfoTemplate and include three fields
//用于选择结果,包含多个字段。
infoTemplate: new InfoTemplate("Ecological Footprint", "<a href= ${URL} target=_blank ;'>Additional Info</a></br></br>省会: ${name}</br>简介: ${SHAPE_Area}") });
//Set the sources above to the search widget
//将搜索结果源显示在搜索部件上
search.set("sources", sources);
});
search.startup();
});
</script>
</head>
<body>
<div id="search"></div>
<div id="info">
<div>Search a country to find its ecological footprint and rating.</div>
</div>
<div id="map"></div>
</body> </html>
ArcGIS Server开发实践之【Search Widget工具查询本地地图服务】的更多相关文章
- ArcGIS Server 开发实践之【Search类】
开发中整理的.不足之处还请谅解! ----------------------------------------------- Class:Search 调用方式:require(["es ...
- ArcGIS server 开发实践之【FeatureLayer类】
全是干活,你值得拥有 要素图层类简介:Class:FeatureLayer //调用方式:require(["esri/layers/FeatureLayer"],function ...
- 【ArcGIS Server 开发系列】Flyingis六大系列讲座精品PDF奉献
转自:http://www.cnblogs.com/gispeng/archive/2008/07/24/1250116.html [ArcGIS Server 开发系列]Flyingis六大系列讲座 ...
- ArcGIS Server开发教程系列(3)切片
切片工作,我们可以一级一级的切,也可以,所有的一块切,Recreate All Tiles这项是说,在没有进行任何的切片工作时,可以选用这项:Recreate Empty Tiles这项是说,如果之前 ...
- ArcGIS Server开发教程系列(7)使用ArcGIS API for Javascript-Hello World
ArcGIS API for Javascript API下载地址:http://support.esrichina-bj.cn/2011/0223/960.html 选择最新的下载就好了,目前是3 ...
- ArcGIS Server开发教程系列(1) Arcgis server 10.1 的安装
本系列所使用的软件版本如下: Windows 7 X64 / Windows server 2008 X64 Arcgis for Desktop 10.1 Arcgis 10.1 for serve ...
- ArcGIS Server开发教程系列(2)配置ARCMAP和ARCCatalog发布服务
1. Arc catalog的配置 打开catalog,如图新增刚刚创建的server 1. Use GIS services: 用户身份连接 使用此种连接,可以浏览.使用站点内发布的所有 ...
- ArcGIS API for Silverlight部署本地地图服务
这一节我们来讲新建立的ArcGIS API for Silverlight应用程序如何加载自己的地图服务的问题,网上的资料讲的都有点含糊不清,这次我们详细的讲一下配置的步骤: 首先介绍下我们的开发和部 ...
- ArcGIS Server开发教程系列(8)ArcGIS API for Javascript-控件(小部件)
1. 鹰眼 OverviewMap小部件用于在其关联的主地图内较清楚的当前鸟瞰图的范围.当主地图范围变化时,鹰眼图会自动在其空间内更新范围以保持和地图的当前范围保持一致,当鹰眼图空间的地图范围 ...
随机推荐
- dubbo+zookeeper简单环境搭建
dubbo+zoopeeper例子 [TOC] 标签(空格分隔): 分布式 dubbo dubbo相关 dubbo是目前国内比较流行的一种分布式服务治理方案.还有一种就是esb了.一般采用的是基于Ap ...
- sys.dm_db_wait_stats
sys.dm_db_wait_stats 返回在操作期间执行的线程所遇到的所有等待的相关信息. 可以使用此聚合视图来诊断 Azure SQL Database 以及特定查询和批处理的性能问题. 执行查 ...
- Android线程之并发处理
上一篇为大家介绍了关于Looper的简单知识,本篇我们介绍一下多线程的并发处理,我们知道Handler通过sendMessage()发送的消息,首先发送给了Looper,存入Looper的消息栈,之后 ...
- Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案
Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案,ext 的CheckboxSelectionModel在后台默认选中之后,前台就不允许编辑的bug是存 ...
- Java多线程系列--“JUC原子类”05之 AtomicLongFieldUpdater原子类
概要 AtomicIntegerFieldUpdater, AtomicLongFieldUpdater和AtomicReferenceFieldUpdater这3个修改类的成员的原子类型的原理和用法 ...
- JavaScript中{}+{}
在 JavaScript 中,加法的规则其实很简单,只有两种情况: 把数字和数字相加 把字符串和字符串相加 所有其他类型的值都会被自动转换成这两种类型的值. 为了能够弄明白这种隐式转换是如何进行的,我 ...
- SQL Server代理(8/12):使用SQL Server代理外部程序
SQL Server代理是所有实时数据库的核心.代理有很多不明显的用法,因此系统的知识,对于开发人员还是DBA都是有用的.这系列文章会通俗介绍它的很多用法. 在这个系列的上篇文章里,你学习如何使用SQ ...
- Tornado框架
Tornado介绍 Tornado 是 FriendFeed 使用的可扩展的异步非阻塞式 web 服务器及其相关工具的开源版本.这个 Web 框架看起来有些像web.py(豆瓣用这个写的) 或者 Go ...
- java中synchronized关键字的用法
在java编程中,经常需要用到同步,而用得最多的也许是synchronized关键字了,下面看看这个关键字的用法. 因为synchronized关键字涉及到锁的概念,所以先来了解一些相关的锁知识. j ...
- 图片和Base64之间的转换
public static Bitmap GetImageFromBase64String(string strBase) { try { MemoryStream stream = new Memo ...