<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html {width: 100%;height:100%;margin:0;font-family:"微软雅黑";}
#allmap{width:845px;height:400px;}
p{margin-left:5px; font-size:14px;}
.BMap_bubble_content{
color:red;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您申请的百度的ak"></script>
<title>根据关键字本地搜索</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap"); //初始化地图
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
var local = new BMap.LocalSearch(map, {
onSearchComplete:myFun
});
map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用
local.search("您要搜索的地址");//这里是企业输入的地址 function myFun() {
var pp = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
map.centerAndZoom(pp,15); //设置地图显示中间点、地图显示级别
console.log(pp.lat,pp.lng)
var point = new BMap.Point(pp.lng,pp.lat);
var marker = new BMap.Marker(point);
map.addOverlay(marker); // 将标注添加到地图中
map.centerAndZoom(point, 15);
var opts = {
width : 200, // 信息窗口宽度
height: 80, // 信息窗口高度
title : "xxxx公司" , // 信息窗口标题
enableMessage:true,//设置允许信息窗发送短息
message:""
}
var infoWindow = new BMap.InfoWindow("地址:XXXXXXX", opts); // 创建信息窗口对象 //点击按钮弹出信息窗口
marker.addEventListener("click", function(){
map.openInfoWindow(infoWindow,point); //开启信息窗口
});
}
</script>

百度地图api使用,简单搜索+经纬度定位+自定义消息窗口的更多相关文章

  1. 百度地图API 显示区域边界及地名定位

    百度地图API 显示区域边界及地名定位 这个定位一共用了两个方法组成 一个是定位绘制区域边界线,另一个是地名定位 原理: 当用户输入省.市.县.区这种大地名时,我们要定位用户输入的这个位置,并显示轮廓 ...

  2. 百度地图API 根据地址查询经纬度

    html页面.引用上API: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> ...

  3. 百度地图api的简单应用

    百度地图api 获取经纬度(通过浏览器的) //获取经纬度 window.navigator.geolocation.getCurrentPosition(function(position) { a ...

  4. 百度地图API根据地名获取经纬度

    运用了Geocoding API,它包括地址解析和逆地址解析功能. 地址解析是指,由详细到街道的结构化地址得到百度经纬度信息,且支持名胜古迹.标志性建筑名称直接解析返回百度经纬度.例如:“北京市海淀区 ...

  5. 百度地图api的简单应用(一):POI检索

    使用之前,需要注册一个百度地图开发者账号,最好申请一个认证以获取更高的使用配额和并发上限. 注册之后,申请一个应用,获得一个ak(密钥),并填写ip地址白名单.(这里我使用0.0.0.0/0,查了自己 ...

  6. 百度地图api之----根据用户ip定位城市

    LocalCity 这个类是利用用户IP地址去百度数据库里查询得到IP所在的城市,用法如下: var objCity = new BMap.LocalCity(); objCity.get(funct ...

  7. 百度地图API地址转换成经纬度

    public class LngAndLatUtil { public static Map<String,Double> getLngAndLat(String address){ Ma ...

  8. 利用百度地图API根据地址查询经纬度

    传上来只是为了记录下三种jsonp方式,$.get(url, callback)方式不行,会出错 -- 必须指明返回类型为”json”才行. 或者使用$.getJSON()或者$.ajax({}). ...

  9. 利用百度地图API实现地址和经纬度互换查询

    import json import requests def baiduMap(input_para): headers = { 'User-Agent': 'Mozilla/5.0 (Window ...

随机推荐

  1. SpringXML方式配置bean的生命周期lifecycle

    在Spring中容器在初始化某个bean的时候会有相应的生命周期,类似于Servlet,有相应的init,destory等方法 例如:如下service 1 2 3 4 5 6 7 8 9 10 11 ...

  2. Appium Remote webdriver调用

    remote webdriver的模板 默认开启4723端口接受webdriver请求 默认开启4724用于和android通讯 #coding:utf-8 #Import the common pa ...

  3. 浅析Postgres中的并发控制(Concurrency Control)与事务特性(上)(转)

    这篇博客将MVCC讲的很透彻,以前自己懂了,很难给别人讲出来,但是这篇文章给的例子就让人很容易的复述出来,因此想记录一下,转载给更多的人 转自:https://www.cnblogs.com/flyi ...

  4. Android 代码实现viewPager+fragment 模仿今日头条的顶部导航

    模仿今日头条的顶部导航:    下载地址: http://download.csdn.net/detail/u014608640/9917700 效果图:

  5. 每周荐书:云原生、Docker、Web算法(评论送书)

    每周荐书:云原生.Docker.Web算法(评论送书) 感谢大家对每周荐书栏目的支持,先公布下上周中奖名单 名优秀评论可以免费获得此书.   云原生应用架构实践 云原生架构,关注简化开发流程.提升研发 ...

  6. [置顶] Android 关于SP读取与存储正确打开方式?

    一.存储方式分类:SharedPreferences存储 二.SharedPreferences存储 1.特点 ①存储单一数据,例如数值,字符串,布尔 ②文件:/date/date/包名/shared ...

  7. List connected users–similar to task manager

    class Program { [DllImport("wtsapi32.dll")] static extern IntPtr WTSOpenServer([MarshalAs( ...

  8. Windows批处理笔记

    1. 路径类相关代号 %i提取第i个命令选项,例如%1提取第1个option,i可以取值从1到9 %~0: 取文件名(名+扩展名) %~f0:取全路径 %~d0:取驱动器名 %~p0:只取路径(不包驱 ...

  9. HDU1003 Max Sum

    解题思路:最大连续和,此题多了记录的下标,具体见代码. #include<cstdio> #include<algorithm> using namespace std; #d ...

  10. 使用css固定table第一列

    .table{width:100%;overflow-x: scroll;background-color:#7c95b5;} .fixedTable{width:160%;text-align: c ...