百度地图搜索地点导航

<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,#allmap {width: 100%;height: 95%;overflow: hidden;margin:0;font-family:"微软雅黑";}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=zfTIKtNx9zBgxLIwpAOt28dE"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
    <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
    
    <title>导航到目标地点</title>
</head>
<body>
    <div id="allmap"></div>
    <center><div><input id="keyword" type="text"/>
    <%--<input type="text" id="jingweidu"/>
    --%><input type="button" value="搜索" onclick="searchByStationName();"/></div></center>
</body>
</html>
<script type="text/javascript">
    var map = new BMap.Map("allmap");
    
    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.centerAndZoom(new BMap.Point(r.point.lng, r.point.lat), 11);
            map.panTo(r.point);
        }
        else {
            alert(‘failed‘+this.getStatus());
        }        
    },{enableHighAccuracy: true})
    
    var localSearch = new BMap.LocalSearch(map);
    localSearch.enableAutoViewport(); //允许自动调节窗体大小
    
    function searchByStationName() {
        map.clearOverlays();//清空原来的标注
        var keyword = document.getElementById("keyword").value;
         localSearch.setSearchCompleteCallback(function (searchResult) {
            var poi = searchResult.getPoi(0);
            //document.getElementById("jingweidu").value = poi.point.lng + "," + poi.point.lat;
            map.centerAndZoom(poi.point, 13);
            map.enableScrollWheelZoom();
            
            var content = "经度:" + poi.point.lng + "<br/>纬度:" + poi.point.lat;
            var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat));  // 创建标注,为要查询的地方对应的经纬度

map.addOverlay(marker);
            marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
            marker.addEventListener("click", function(e){
                searchInfoWindow.open(marker);
            })
            //创建检索信息窗口对象
            var searchInfoWindow = null;
            searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, {
                    title  : keyword,      //标题
                    width  : 290,             //宽度
                    height : 105,              //高度
                    panel  : "panel",         //检索结果面板
                    enableAutoPan : true,     //自动平移
                    searchTypes   :[
                        BMAPLIB_TAB_SEARCH,   //周边检索
                        BMAPLIB_TAB_TO_HERE,  //到这里去
                        BMAPLIB_TAB_FROM_HERE //从这里出发
                    ]
                });
            
        });
        localSearch.search(keyword);
    }
</script><%--

var geoc = new BMap.Geocoder();

map.addEventListener("click", function(e){        
    var pt = e.point;
    geoc.getLocation(pt, function(rs){
        var addComp = rs.addressComponents;
        var url="http://api.map.baidu.com/marker?location="+r.point.lat+","
           +r.point.lng+"&title=目标位置&content="+addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber+"&output=html";
           window.location.href = url;
        });        
});
--%>

时间: 2024-10-18 05:08:10

百度地图搜索地点导航的相关文章

【百度地图API】交你如何用百度地图搜索自己的数据!不需数据库!

原文:[百度地图API]交你如何用百度地图搜索自己的数据!不需数据库! 摘要: 我有一定的房产数据,还有银行数据.我想在百度地图上标注出来,并且能搜索到我这些数据. 可是百度的数据库上并没有我的数据.我应该怎么办呢? ------------------------------------------------------------------------------------------ 一.无需数据库,如何建立自己的地理信息表. 如果让初学者去建立数据库,那么意味着大家还要学习数据库,

js调用百度地图搜索功能

引用百度jsApi <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=xxxxxxxxxxxx"></script> 创建地址解析器: var localSearch = null; //查询参数 var options = { //智能搜索 onSearchComplete: function (results) { //查询结果状态码

百度地图搜索(2)

搜索的核心类: MKSearch和MKSearchListener MKSearch:用于位置检索.周边检索.范围检索.公交检索.驾乘检索. MKSearchListener:查出的结果由MKSearchListener处理 ***使用百度地图必须进行的准备工作: 1.初始化: 1).到百度的服务器端检验KEY 创建initManager()方法进行检验的操作: ①.创建百度地图的管理器对象: ②.对管理器对象进行初始化,调用init方法 init(String strKey, MKGenera

Axure RP 7.0移动APP原型设计实战精讲视频课程

经过了漫长的教案设计+录课的过程,与初次开通在线教育课程的诸多需要尝试的点,我在51CTO学院的第一门课程终于在6月下旬与各位小伙伴们见面啦:)      欢迎小伙伴们捧场,想要深入学习的可以作为付费用户,暂时不想学习Axure RP的小伙伴们去拍砖增加点人气,不胜感激!      付费特权:24小时讲师答疑   所有课时永久观看   专属资料下载    购买课程返学分 本套课程由阿蜜果倾力为您打造,不忽视理论,但更重实战!!! 通过简明扼要的语言,讲解Axure RP 7.0的理论知识. 通过

第一章 算法在计算机中的应用

第一章: 讲了算法(algorithm)的基本概念,以及算法的作用.(这些可以看书) 用个人的话来讲,你可以把算法当做一个解决问题的方法,就像数学里的各种公式一样,你也可以把他们认为是一种算法.算法无处不在,而且算法必须存在,否则我们的生活都将变得缓慢,迟钝. 举个例子:我们平时出去游玩时,要事先查好路线,这时就可以用百度地图搜索从A地到B地的路线,地图上会给出最快的乘车路线,这些路线是怎么给出来的,就是用了最短路的算法,关于最短路的算法有很多,比如Dijkstra, Bellman, Floy

第一篇博客--记面陌陌科技计算机视觉算法工程师被刷经历(附面试过程中被问倒的一些算法题分析)

求职季,真的会让一个人变得有些不一样吧,比如我,对于一个菜鸟来说,最近一段时间焦虑不安外加有点自闭... 前段时间在校内网上看到了陌陌科技内推计算机视觉算法工程师和机器学习算法工程师的消息,抱着试试的心态整理了一份简历按照提供的邮箱投出去了,我想这次应该又是石沉大海了吧,谁想在一周前闷热的一天在嘈杂的餐厅接到了陌陌科技HR的电话,一周后的周五下午4点在西安的一家咖啡馆参加面试.我问清了时间地点并道谢了HR后并挂了电话继续吃饭. 好吧,这周每天都有各个公司的笔试,外加这周周五上午的组会轮到我做组会

汽车票O2O战役打响,谁最有可能成为大赢家?

从打车.专车.拼车到代驾,出行O2O早已成为了巨头们争夺的焦点.国庆长假前夕,手机百度参战到在线汽车票市场并推出了“百度快行”,再次引发了一场新的出行O2O大战.来自交通运输部的统计数据显示,2013年我国公路出行人次占到了总出行人次的86.37%,2014年公路出行人次占总出行人次比例为87.32%,而长途客运作为公路出行非常重要的一部分,将会成为出行O2O平台竞争的战略要点.纵观当前国内的汽车票市场,着实让广大客运朋友不太满意,刘旷认为主要是以下原因造成: 1.首先第一个让客运朋友不满意的地

Alfred的配置和使用

http://www.jianshu.com/p/f77ad047f7b0 Alfred:mac上的神兵利器,提升工作效率*n,快捷键:option + 空格.鉴于是看了池老师的<人生元编程>才全面使用Alfred,所以先标出池老师的博客:http://macshuo.com/ ,这个更精彩; 下面开始是我的使用心得 代替spotlight 程序的快速启动入口 强大的workflow 文件检索 find *** : 定位文件open *** : 定位并且打开文件in *** : 在文件中检索.

百度地图商家数据(联系方式、具体位置)采集方法

随着营销和商业化的需要,尤其是O2O领域,寻找电销的目标客户都是需要准备的工作,那么如何能快速找到联系方式?百度地图可能是目前已知数据最全,最大的数据中心.这里几乎包含了各行各业的数据商家数据,如医院.银行.KTV.美发等等各种数据. 百度数据采集攻略: 第一步:在百度地图搜索一下看看能不能搜出来.[改部分可略] 第二步:通过goodsbye,提供采集服务.goodsbye可以根据关键词,城市,为用户免费采集.goodsbye的官网:http://www.goodsbye.com     goo