百度地图JavaScript API经纬度查询-MAP-ABCDEFGHIJKMHNOPQRSTUVWXYZ：

搜索：<input type="text" size="20" name="keyword" id="keyword" /> <input type="submit" value="提交" onclick="MblogDotccMap(document.getElementById('keyword').value)" />

<!--
更多技术分享请看博客：http://blog.csdn.net/fuyifang
-->
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>百度地图Demo-更多技术分享请看博客：http://blog.csdn.net/fuyifang</title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
</head>
<body>
    <div style="width: 520px; height: 340px; border: 1px solid gray" id="container">
    </div>
</body>
</html>
<script type="text/javascript">

    var map = new BMap.Map("container"); //初始化地图

    var opts = { type: BMAP_NAVIGATION_CONTROL_LARGE }; //初始化地图控件
    map.addControl(new BMap.NavigationControl(opts));

    var point = new BMap.Point(121.48, 31.22); //初始化地图中心点
    var marker = new BMap.Marker(point); //初始化地图标记
    marker.enableDragging(); //标记开启拖拽

    var gc = new BMap.Geocoder();
    //添加标记拖拽监听
    marker.addEventListener("dragend", function (e) {
        //获取地址信息
        gc.getLocation(e.point, function (rs) {
            showLocationInfo(e.point, rs);
        });
    });

    //添加标记点击监听
    marker.addEventListener("click", function (e) {
        gc.getLocation(e.point, function (rs) {
            showLocationInfo(e.point, rs);
        });
    });

    map.centerAndZoom(point, 15); //设置中心点坐标和地图级别
    map.addOverlay(marker); //将标记添加到地图中

    //显示地址信息窗口
    function showLocationInfo(pt, rs) {
        var opts = {
            width: 250, //信息窗口宽度
            height: 100, //信息窗口高度
            title: "" //信息窗口标题
        }

        var addComp = rs.addressComponents;
        var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br />";
        addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;
        //alert(addr);

        var infoWindow = new BMap.InfoWindow(addr, opts); //创建信息窗口对象
        marker.openInfoWindow(infoWindow);
    }
    function MblogDotccMap(keyword) {
        //搜索
        var local = new BMap.LocalSearch(map,
         { renderOptions: { map: map, panel: "results_info" }
          }
         );

        map.panBy(point);

        local.search(keyword);

        local.getResults()

        local.setSearchCompleteCallback(function (searchResult) {
            var poi = searchResult.getPoi(0);
            //alert(poi.point.lng+"   "+poi.point.lat);
            //document.getElementById("info").innerHTML = "<strong>" + keyword + "</strong>" + "坐标：" + poi.point.lng + "," + poi.point.lat;
        });

    }

</script>
<div id="results_info"></div>
搜索：<input type="text" size="20" name="keyword" id="keyword" /> <input type="submit" value="提交" onclick="MblogDotccMap(document.getElementById('keyword').value)" />
<!--
更多技术分享请看博客：http://blog.csdn.net/fuyifang
-->

百度地图JavaScript API经纬度查询-MAP的更多相关文章

  1. 百度地图JavaScript API使用

    最近在完成优达学城前端开发(入门)课程的P4项目中,要求调用google地图进行交互,项目已提供部分js代码和html代码.但在申请google地图API密钥时由于网络等原因,打不开或者连接超时,所以 ...

  2. 百度地图JavaScript API覆盖物旋转时出现偏移

    在项目中,调用百度地图JavaScript API,做覆盖物的旋转再添加到地图上,结果出现偏移了. 调试过程中的效果图: 发现图片的旋转并不是按车子的中心来的,而是之外的一个点.最后发现犯了一个很细节 ...

  3. 【百度地图JavaScript API】手机端浏览器定位的实现

    [百度地图JavaScript API]手机端浏览器定位的实现 https://blog.csdn.net/xiao190128/article/details/72579476

  4. 百度地图JavaScript API获取用户当前经纬度和详细地理位置，反之通过详细地理位置获取当前经纬度

    前言: 前端时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能,为了方便下次找起来方便一些自己在这里记录一下,希望也能够 ...

  5. 百度地图 JavaScript API 极速版 开发体会

    前段时间百度地图API推出了 JavaScript API 极速版 1.0 简单看了一下,从产品定位来说真是挺好. 把开发人员细分成普通web开发人员和移动web开发人员.正好用到了手机地图这块决定尝 ...

  6. 百度地图JavaScript API自定义覆盖物、自定义信息窗口增删时的显示问题

    项目中,需求:在百度地图上实时画出车辆,并能点击车辆弹出信息框查看实时信息. 实现:通过不停的画覆盖物并删除掉.点击覆盖物时弹出信息窗口. 问题:删除掉覆盖物后信息窗也删除掉了.因为信息窗是建立在覆盖 ...

  7. 百度地图JavaScript API本地搜索的结果面板

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. 百度地图 JavaScript API

    最近有点懒  项目结尾了  完了好长时间 没有去总结项目中的问题 想了下还是写写吧 这是一个关于百度地图的 网页展示 <!DOCTYPE html><html><head ...

  9. 百度地图 Javascript API 笔记

    因为最近的一个项目用到,所以自己整理了一下遇到的一些坑 自己写了一个类库来二次封装用于调起常用的功能:https://github.com/iRuxu/iBMap 快速文档链接 Javascript ...

随机推荐

  1. 覆盖equals()时总要覆盖hashCode()

    覆写如下: public class User{ private Integer id; private String userName; private String passWord; publi ...

  2. bzoj 4872: [Shoi2017]分手是祝愿 [期望DP]

    4872: [Shoi2017]分手是祝愿 题意:n个灯开关游戏,按i后i的约数都改变状态.随机选择一个灯,如果当前最优策略\(\le k\)直接用最优策略.问期望步数\(\cdot n! \mod ...

  3. 树莓派3B上部署运行.net core 2程序

    针对Linxu arm处理器如何部署.net core 2的资料很少,网上找到几篇但都写得不够详细,按照他们教程来撞墙了,折磨了几天终于部署成功了,先上一张运行成功的图 1.windows系统中,在项 ...

  4. String，StringBuffer，StringBuilder的区别

    数据结构: 数据结构是指相互之间存在一种或多种特定关系的数据元素的集合. 比如数据库就是对硬盘中的数据进行有规则的管理,可以进行增删改查工作,而良好的数据结构可以优化这些操作, 也许大家会想这些和St ...

  5. 017 Java中的静态代理、JDK动态代理、cglib动态代理

    一.静态代理 代理模式是常用设计模式的一种,我们在软件设计时常用的代理一般是指静态代理,也就是在代码中显式指定的代理. 静态代理由业务实现类.业务代理类两部分组成.业务实现类负责实现主要的业务方法,业 ...

  6. Hive 时间日期处理总结

    最近用hive比较多,虽然效率低,但是由于都是T+1的业务模式.所以也就不要求太多了,够用就行.其中用的吧比较多就是时间了,由于大数据中很多字段都不是标准的时间类型字段,所以期间涉及了很多的时间日期字 ...

  7. Appium基于Python unittest自动化测试 & 自动化测试框架 -- PO并生成html测试报告

    基于python单元测试框架unittest完成appium自动化测试,生成基于html可视化测试报告 代码示例: #利用unittest并生成测试报告 class Appium_test(unitt ...

  8. Python——文件操作详解

    python中对文件.文件夹(文件操作函数)的操作需要涉及到os模块和shutil模块. 得到当前工作目录,即当前Python脚本工作的目录路径: os.getcwd() 返回指定目录下的所有文件和目 ...

  9. 浅谈 maxMemory , totalMemory , freeMemory 和 OOM 与 native Heap

    作者:林冠宏 / 指尖下的幽灵 掘金:https://juejin.im/user/587f0dfe128fe100570ce2d8 博客:http://www.cnblogs.com/linguan ...

  10. Qt ActiveX web dome 详细例子

    http://doc.qt.io/qt-5.9/activeqt-server.html hierarchy 例子 #ifndef OBJECTS_H #define OBJECTS_H #inclu ...