引用第三方高德地图接口---使用js脚本进行开发地图定位的步骤
①在高德地图开发平台注册一个账号，获取key
②添加新的key
③引入map插件
④复制过来map的脚本代码和编写搜索框
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key=你申请的key&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
<body>
<input type="text" id="tipinput" style="margin-left:380px;width:300px;height:40px;padding-left:10px;font-weitht:900px;"/> //搜索框
<div id="container" style="width:1000px;height:600px;"></div> //地图显示区域
</body>
<script type="text/javascript">
//地图加载
var map = new AMap.Map("container", {
resizeEnable: true
});
//输入提示
var autoOptions = {
input: "tipinput"
};
var auto = new AMap.Autocomplete(autoOptions);
var placeSearch = new AMap.PlaceSearch({
map: map
}); //构造地点查询类
AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
function select(e) {
placeSearch.setCity(e.poi.adcode);
placeSearch.search(e.poi.name); //关键字查询查询
}
</script>
引用第三方高德地图接口---使用js脚本进行开发地图定位的步骤的更多相关文章
- kettle 6.1 通过JS脚本与SwitchCase结合实现目标步骤选择
场景: 判断抽取的数据在目标库中是否已经存在(同一个病人是否已经存在治疗方案号): 1.若不存在,则GROUPROWNO=1,并Insert into 目标库 ( 判断外关联字段是否为空 ) 2. ...
- 关于Cocos Creator用js脚本代码播放骨骼动画的步骤和注意事项
步骤: 1.用cc.find()方法找到相应的骨骼动画节点,并把这个对象赋值给一个var出来的新对象. 具体代码:var spineboy_anim = cc.find("UI_Root/a ...
- Node.js 从零开发 web server博客项目[接口]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[express重构博客项目]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[数据存储]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[koa2重构博客项目]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[安全]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[日志]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[登录]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
随机推荐
- Eclipse的tomcat插件
下载Tomcat Eclipse插件 http://www.eclipsetotale.com/tomcatPlugin.html 或者我的网盘 将tomcatPluginV321.zip内容解压到 ...
- struts2接收参数的几种形式
1.使用属性 HTML: <form action="login" method="post" name="form1"> 用户 ...
- DIV+CSS布局重新学习之float/margin/padding
之前对div的css布局一直有点半知半解,只其然却不知其所以然,到网上下载了“十天学会DIV+CSS(WEB标准)”的chm电子版,然后跟着练习了一下,特在此记录,备忘. <!DOCTYPE h ...
- JSTL中c:forEach循环里的值的substr操作及对String操作的常用API
<c:forEach items="${dataList}" var="item" varStatus="itemStatus"> ...
- Web服务器性能压力测试工具http_load、webbench、ab、Siege使用教程
Web服务器性能压力测试工具http_load.webbench.ab.Siege使用教程 作者: feng 日期: 2012/07/25 发表评论 (0) 查看评论 一.http_load 程序 ...
- linux 挂载硬件设备
mount命令用于挂载文件系统,格式为:“mount 文件系统 挂载目录”. 挂载是在使用硬件设备前的最后操作的一步,只需要用mount命令把硬件设备与一个目录做关联,然后就能在这个目录中看到硬件设备 ...
- Oracle快速克隆安装
Oracle的家目录进行快速克隆,对同类型机器配置很高效的! 01.确认你在克隆数据库时,原数据库已经关闭 sqlplus / as sysdba; shutdown immediate ; ...
- js的7个技巧
http://www.vaikan.com/seven-javascript-things-i-wish-i-knew-much-earlier-in-my-career/
- HDUOJ----Ignatius and the Princess III
Ignatius and the Princess III Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K ...
- HDUOJ--点球大战
点球大战 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submi ...