AMap行政区查询服务
AMap.DistrictSearch行政区查询服务插件,提供全国各省、市、县、区的中心点经纬度、行政区边界坐标组、下级行政区等信息。根据行政区边界坐标组可在地图上绘制行政区边界。(本文为原创,并在项目中验证成功。作者:张甫军)
第一步,插件及样式的引用:
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css" />
<script src="http://webapi.amap.com/maps?v=1.3&key=7defcebd378d7fcd05dbcb9298d20d2e&plugin=AMap.PolyEditor,AMap.CircleEditor,AMap.MouseTool,AMap.DistrictSearch"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/demos/js/liteToolbar.js"></script>
第二步,HTML代码:
<div id="container"></div>
<div id="tip">
省:<select id='province' style="width:100px" onchange='search(this)'></select>
市:<select id='city' style="width:100px" onchange='search(this)'></select>
区:<select id='district' style="width:100px" onchange='search(this)'></select>
街道:<select id='street' style="width:100px" onchange='setCenter(this)'></select>
<input type="button" id="clearMap" onclick="clearMap()" value="清除" />
</div>
第三步,页面CSS样式:
<style type="text/css">
#tip {
background-color: #fff;
padding: 0 10px;
border: 1px solid silver;
box-shadow: 3px 4px 3px 0px silver;
position: absolute;
font-size: 12px;
right: 10px;
top: 5px;
border-radius: 3px;
line-height: 36px;
}
</style>
第四步,JavaScript代码:
- 初始化地图:
var editorTool, district, polygons = [], citycode, map = new AMap.Map("container", {
//resizeEnable: true,
//center: [116.403322, 39.900255],
//zoom: 13
resizeEnable: true,
//center: [116.30946, 39.937629],
zoom: 3
}); - 初始化搜索下拉框:
var citySelect = document.getElementById('city');
var districtSelect = document.getElementById('district');
var areaSelect = document.getElementById('street'); var opts = {
subdistrict: 1,
level: 'city',
showbiz: false
};
district = new AMap.DistrictSearch(opts);
district.search('中国', function (status, result) {
if (status == 'complete') {
getData(result.districtList[0]);
}
});
var mapCenter = null;
var districtObj = {
Center: null,
Bounds: null
};
function getData(data) {
var bounds = data.boundaries;
mapCenter = data.center;
districtObj.Center = data.center;
districtObj.Bounds = bounds == null ? districtObj.Bounds : bounds;
console.log('default1');
if (bounds && '@((int)ElectronicFenceModel.ShapeType.District)' == '@((int)shapeType)') {
for (var i = 0, l = bounds.length; i < l; i++) {
var polygon = new AMap.Polygon({
map: map,
strokeWeight: 1,
strokeColor: '#CC66CC',
fillColor: '#CCF3FF',
fillOpacity: 0.5,
path: bounds[i]
});
polygons.push(polygon);
}
map.setFitView();
} var subList = data.districtList;
var level = data.level; if (level === 'province') {
nextLevel = 'city';
citySelect.innerHTML = '';
districtSelect.innerHTML = '';
areaSelect.innerHTML = '';
} else if (level === 'city') {
nextLevel = 'district';
districtSelect.innerHTML = '';
areaSelect.innerHTML = '';
} else if (level === 'district') {
nextLevel = 'street';
areaSelect.innerHTML = '';
}
if (subList) {
var contentSub = new Option('--请选择--');
for (var i = 0, l = subList.length; i < l; i++) {
var name = subList[i].name;
var levelSub = subList[i].level;
var cityCode = subList[i].citycode;
if (i == 0) {
document.querySelector('#' + levelSub).add(contentSub);
}
contentSub = new Option(name);
contentSub.setAttribute("value", levelSub);
contentSub.center = subList[i].center;
contentSub.adcode = subList[i].adcode;
document.querySelector('#' + levelSub).add(contentSub);
}
} }
function search(obj) {
//清除地图上所有覆盖物
for (var i = 0, l = polygons.length; i < l; i++) {
polygons[i].setMap(null);
}
var option = obj[obj.options.selectedIndex];
var keyword = option.text; //关键字
var adcode = option.adcode;
district.setLevel(option.value); //行政区级别
district.setExtensions('all');
//行政区查询
//按照adcode进行查询可以保证数据返回的唯一性
district.search(adcode, function (status, result) {
if (status === 'complete') {
getData(result.districtList[0]);
setFence();
}
});
}
function setCenter(obj) {
mapCenter = obj[obj.options.selectedIndex].center;
map.setCenter(obj[obj.options.selectedIndex].center);
setFence();
} function clearMap() {
map.clearMap();
}以上代码,可以完成行政区查询,提供全国各省、市、县、区的中心点经纬度、行政区边界坐标组、下级行政区等信息。根据行政区边界坐标组可在地图上绘制行政区边界。注意:AMap.DistrictSearch行政区查询服务插件的初始化有2种方式,第一种:使用插件同步下发功能才能这样直接使用(本文采用此种方式,注意查看插件的引用);第二种:(查看下面的代码)
mapObj.plugin('AMap.DistrictSearch', function () {
var opts = {
subdistrict: 0, //返回下一级行政区
extensions: 'all', //返回行政区边界坐标组等具体信息
level:'city' //查询行政级别为 市
};
mapObj.plugin('AMap.DistrictSearch', function () {
var opts = {
subdistrict: 0, //返回下一级行政区
extensions: 'all', //返回行政区边界坐标组等具体信息
level:'city'//查询行政级别为市
};
AMap行政区查询服务的更多相关文章
- C#调用天气查询服务
先引入天气查询服务 1.有点引用导入服务引用 //实例化 web引用名.WeatherWebService cn = new web引用名.WeatherWebService() ...
- .NET应用架构设计—面向查询服务的参数化查询设计(分解业务点,单独配置各自的数据查询契约)
阅读目录: 1.背景介绍 2.对业务功能点进行逻辑划分(如:A.B.C分别三个业务点) 2.1.配置映射关系,对业务点配置查询契约(构造VS插件方便生成查询契约) 2.2.将配置好的映射策略文件放在调 ...
- 用.net访问电子枢纽信用中心的数据查询服务
概要说明 电子枢纽全称国家交通运输物流公共信息平台,主要提供物流及生产企业进行物流相关数据交换的标准和API,详细介绍可参考其官网www.logink.org,本文假定阅读者对该平台已有了解,并已成功 ...
- MVC项目实践,在三层架构下实现SportsStore-09,ASP.NET MVC调用ASP.NET Web API的查询服务
ASP.NET Web API和WCF都体现了REST软件架构风格.在REST中,把一切数据视为资源,所以也是一种面向资源的架构风格.所有的资源都可以通过URI来唯一标识,通过对资源的HTTP操作(G ...
- AspNet.WebAPI.OData.ODataPQ实现WebAPI的分页查询服务-(个人拙笔)
AspNet.WebAPI.OData.ODataPQ 这是针对 Asp.net WebAPI OData 协议下,查询分页.或者是说 本人在使用Asp.Net webAPI 做服务接口时写的一个分页 ...
- 基于FeignClient提供简单的用户查询服务
前言: 由于系统升级,之前的员工数据库(mongo库)被弃用,改为用python维护的mysql库,其他系统访问通过http请求,表结构对外不可见,其他系统之前对员工mongo库的依赖要解除.每套系统 ...
- Ajax轮询——“定时的通过Ajax查询服务端”
Ajax轮询——"定时的通过Ajax查询服务端". 概念: 轮询(polling):客户端按规定时间定时像服务端发送ajax请求,服务器接到请求后马上返回响应信息并关闭连接. 百闻 ...
- AspNet.WebAPI.OData.ODataPQ实现WebAPI的分页查询服务-(个人拙笔)(转)
出处:http://www.bubuko.com/infodetail-827612.html AspNet.WebAPI.OData.ODataPQ 这是针对 Asp.net WebAPI ODat ...
- GraphQL介绍&使用nestjs构建GraphQL查询服务
GraphQL介绍&使用nestjs构建GraphQL查询服务(文章底部附demo地址) GraphQL一种用为你 API 而生的查询语言.出自于Facebook,GraphQL非常易懂,直接 ...
随机推荐
- libc++
今天测试最新的微信iOS SDK, 仅仅是建了一个空的工程,把sdk加进去运行,就报了以下错误: Undefined symbols for architecture x86_64: "op ...
- jQuery 遍历 - each() 方法
定义和用法 each() 方法规定为每个匹配元素规定运行的函数. 提示:返回 false 可用于及早停止循环. 语法 $(selector).each(function(index,element)) ...
- C++学习笔记30:模板与型式参数化
转型操作 接受目标型式作为模板参数 Programmer *p = dynamic_cast<Programmer*>(e) 模板工作原理 使用template<typename T ...
- (实用篇)微信支付扫码支付php版
本文实例为大家分享了php微信扫码支付源码,供大家参考,具体内容如下 代码中包含四个文件createUrl.php.ArrayToXML.php.returnGoodsUrl.php.notifyUr ...
- EntityFramework 优化
1.分页的时候,尽量在数据库里面去分页. //在数据库中分页 ).Take().ToList(); //先把数据从数据库中查出来,然后才分页 ).Take(); 2.尽量禁用延迟加载,尽量使用预加载和 ...
- python练手项目
文本操作 逆转字符串--输入一个字符串,将其逆转并输出. 拉丁猪文字游戏--这是一个英语语言游戏.基本规则是将一个英语单词的第一个辅音音素的字母移动到词尾并且加上后缀-ay(譬如"banan ...
- web安全之sql注入的防御
自动把引号转义 1.防御sql注入的基本原则 任何时候不应该改变用户的输入 比如用户输入单引号,那输出也要是单引号. 几种基本的防 ...
- java程序员烂大街为何还不便宜?
最近跟一朋友聊天,他是做c#开发的.他答应了老板带领一帮java工程师开发网站.披星戴月终于搞定,现在已经盈利.但是他公司的那帮搞c#的同事不淡定了. 在招聘java程序员的时候2年有开15k的.5年 ...
- HttpClient封装工具类
import java.io.IOException; import java.net.URI; import java.util.ArrayList; import java.util.List; ...
- iOS、swift、React Native学习常用的社区、论坛
<!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...