<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>高德地图</title>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.11&key=9de88a718781910c9a1c81230827d1ce"></script>
<style type="text/css">
*{
margin: 0;
padding: 0;
list-style: none;
}
#container{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
#setZoomNode,#setCenterNode{
width: 280px;
position: absolute;
z-index: 99;
right: 20px;
top: 50px;
border: 1px solid black;
box-shadow: 0 0 5px black;
background: white;
}
#setCenterNode{
top: 50px;
}
#node li{
cursor: pointer;
}
#searchNode{
width: 280px;
height: 30px;
background: white;
position: absolute;
top: 20px;
right: 20px;
}
</style>
</head>
<body>
<div id="container"></div>
<div id="searchNode">
<input type="" name="" id="searchInput" />
<button id="btn">搜索</button>
</div>
<div id="setCenterNode"> </div> <script type="text/javascript">
var map = new AMap.Map('container',{
zoom:10,
center:[121,30]
}); AMap.service(['AMap.PlaceSearch'],function(){
btn.onclick = function(){
new AMap.PlaceSearch({
pageSize:5, //最多显示五条
pageIndex:1, //在第二页显示
city:'010', //在哪个城市搜索
citylimit:true, //是否限制在城市内搜索
map:map, //展示在哪个地图里
panel:'setCenterNode' //放在哪个元素下
}).search(searchInput.value); //搜索内容
}
}); </script>
</body>
</html>

高德地图&兴趣点(poi)的更多相关文章

  1. 高德地图-搜索服务-POI搜索

    高德地图-搜索服务-POI搜索 之前公司项目收货地址仿饿了么的收货地址,结果发现自己实现的关键字搜索和周边搜索,搜索到的poi列表跟饿了么的并不完全一样,后来考虑了下,应该是搜索的范围.类型之类的设置 ...

  2. 高德地图添加marker及反地理编码获取POI

    项目中集成百度.高德.腾讯地图已是司空见惯的事情,今天我总结了一下项目中用到的高德地图常用的功能: 1.展示高德地图并定位显示定位图标: 2.添加实时大头针: 3.反地理编码获取周围兴趣点 效果如下: ...

  3. 高德地图POI采集(URL-API)

    新手从零学起,成功跑通,记一下,技术大神们多多指点. ———————————————— 1-概述 POI:兴趣点.对于百度.高德等电子地图来说,一个POI是地图上的一个店铺/商场/小区等等. 这次要解 ...

  4. 【高德地图API】从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自有数据检索

    原文:[高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自有数据检索 摘要:地图服务,大家能想到哪些?POI搜素,输入提示,地址解析,公 ...

  5. 根据关键字获取高德地图poi信息

    根据关键字获取高德地图poi信息 百度地图和高德地图都提供了根据关键字获取相应的poi信息的api,不过它们提供给普通开发者使用的次数有限无法满足要求.其次百度地图返回的poi中位置信息不是经纬度,而 ...

  6. JS高德地图应用 ---- 鼠标点击加入标记 & POI搜索

    代码如下 (填入Key值) : <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...

  7. web开发如何使用高德地图API(二)结合输入提示和POI搜索插件

    说两句: 以下内容除了我自己写的部分,其他部分在高德开放平台都有(可点击外链访问). 我所整理的内容以实际项目为基础希望更有针对性的,更精简. 点击直奔主题. 准备工作: 首先,注册开发者账号,成为高 ...

  8. 高德地图POI爬取_Python

    高德地图POI 官方文档:https://lbs.amap.com/api/webservice/guide/api/search#introduce 官网控制台:https://lbs.amap.c ...

  9. 零基础掌握百度地图兴趣点获取POI爬虫(python语言爬取)(代码篇)

    好,现在进入高阶代码篇. 目的: 爬取昆明市中学的兴趣点POI. 关键词:中学 已有ak:9s5GSYZsWbMaFU8Ps2V2VWvDlDlqGaaO 昆明市坐标范围: 左下角:24.390894 ...

随机推荐

  1. 每天五分钟Go - 函数基础

    函数在定义 Go的函数使用func来定义,返回类型支持多个值的返回 func 函数名([参数列]) [返回值类型]{ 方法执行体 } 参数列支持多个参数的声明,同一类型的函数,声明时和变量的声明一样 ...

  2. Java规范的三种注释方式:

    1.单行注释 // //单行注释 2.多行注释 /* */ /* 多行 注释 */ 3.文档注释[java特有的] /** */ ◆注释内容可以被JDK提供的工具javadoc所解析,生成一套以网页文 ...

  3. SLF4J日志桥接的应用

    最近在给公司的测试部门开发一套自动化测试框架,为了是框架产生的测试报告更易于分析,我考虑将每一个用例与运行过程中产生的日志相关联,为了实现这样的效果,首先就需要统一项目的日志输出,那么具体怎么做呢? ...

  4. thinkPHP5 5.0.23 远程代码执行漏洞

    修改数据包 POST /index.php?s=captcha HTTP/1.1 Host: 192.168.49.2:8080 User-Agent: Mozilla/5.0 (Macintosh; ...

  5. 02.反射Reflection

    1. 基本了解 1.1 反射概述 文字说明 审查元数据并收集关于它的类型信息的能力称为反射,其中元数据(编译以后的最基本数据单元)就是一大堆的表,当编译程序集或者模块时,编译器会创建一个类定义表,一个 ...

  6. 20分钟掌握Android Gradle

    目前国内对Android领域的探索已经越来越深,不少技术领域如插件化.热修复.构建系统等都对Gradle有迫切的需求,不懂Gradle将无法完成上述事情.所以Gradle必须要学习. Gradle 里 ...

  7. Spring Cloud Alibaba - Feign

    Feign Feign简介 使用Feign实现消费者客户端 使用Feign+Ribbon实现客户端负载均衡 底层的负载均衡策略还是使用Ribbon通过Feign进行调用 Feign的相关配置 ribb ...

  8. openssl常用命令行汇总

    openssl常用命令行汇总 随机数 openssl rand -out rand.dat -base64 32 摘要 直接做摘要 openssl dgst -sha1 -out dgst.dat p ...

  9. rancherUI添加configmap

    1.创建configmap 2.部署pod,挂载配置文件(通过卷的形式引用)

  10. 授予mysql的其他用户数据库的使用权限

    场景:不同的开发人员有不同的数据库的权限:也可适用于外包公司不同的开发权限. root用户登录数据库,命令行执行下面语句即可. grant select,delete,update,create,dr ...