<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 {

            height: 700px;

            width: 100%;

        }

        #r-result {

            width: 100%;

            font-size: 14px;

        }

    </style>

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=4IU3oIAMpZhfWZsMu7xzqBBAf6vMHcoa"></script>

    <title>城市名定位</title>

</head>

<body>

    <div id="allmap"></div>

    <div id="r-result">

        地址: <input id="cityName" type="text" style="width:100px; margin-right:10px;" />

        <input type="button" value="查询" onclick="theLocation()" />

                        经度:<input type="text" id="jd" />纬度<input type="text" id="wd" />

    </div>

</body>

</html>

<script type="text/javascript">

    // 百度地图API功能

    var map = new BMap.Map("allmap", {

        mapType: BMAP_HYBRID_MAP,

        minZoom: 4,

        maxZoom: 25,

        enableMapClick:false

    });

    var point = new BMap.Point(116.331398, 39.897445);

    map.enableScrollWheelZoom(true);

    map.setDefaultCursor("crosshair");

    map.centerAndZoom('广州', 11);

    map.addEventListener("click", function (e) {

        var input = document.getElementById('wd');

        var input2 = document.getElementById('jd');

        input.value = e.point.lng;

        input2.value = e.point.lat;

    });

    map.addControl(new BMap.NavigationControl());

    var local = new BMap.LocalSearch(map, {

        renderOptions: {

            map: map

        }

    });

    function theLocation() {

        var city = document.getElementById("cityName").value;

        if (city != "") {

            local.search(city);

        }

    }

    var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});

    //添加控件和比例尺

	function add_control(){

		map.addControl(top_left_control);

		map.addControl(top_left_navigation);

		map.addControl(top_right_navigation);

	}

    add_control()

</script>

　　

百度地图失去坐标html的更多相关文章

  1. 如何获取google地图、baidu百度地图的坐标

    google:打开google地图-->查找目的地-->右键:此位置居中-->地址栏键入javascript:void(prompt('',gApplication.getMap() ...

  2. RaceWeb介绍(7)：由500强公司数据高速生成百度地图——生成坐标字段及坐标数据

    接上篇. 一.生成X坐标.Y坐标两个字段. 我们须要为每一个公司建立X坐标和Y坐标字段,用来保存XY坐标. 既然为了突出"快",这一步就有程序来完毕吧. 右键单击"世界5 ...

  3. JSP界面引用百度地图获取坐标

    需求: 需要在JSP界面上引用百度地图,文本框中输入地址之后,自动拿到在百度地图上的经纬度 解决步骤: 1.引入百度地图api: head中进行引用<script type="text ...

  4. thinkphp 百度地图Api坐标计算 A坐标距离B坐标多少公里 并按照距离近的排序 坐标排序 外部字段排序

    感谢我磊哥 函数封装方法: //计算距离 /* **$a 可多数坐标 就是可数组类型的 ***$b 是登录者的坐标 ***ps: lat经度 lng纬度 经度在前纬度在后 *** ***/ funct ...

  5. 照片提取GPS 转成百度地图坐标

    感谢: 小慧only http://www.cnblogs.com/zhaohuionly/p/3142623.html  GPS转化坐标方法 大胡子青松 http://www.cnblogs.com ...

  6. gps数据转百度地图坐标

    昨天大叔问我一个关于gps的问题,一开始我是懵逼的,因为之前我从来没有接触过这玩意儿.稍微查了一下,gps协议包含了$开头和<>结尾,但这并不是重点.大叔告诉我说他们采集了一些位置的经纬度 ...

  7. php 百度地图 腾讯地图 转换坐标

    /* * 中国正常GCJ02坐标---->百度地图BD09坐标 * 腾讯地图用的也是GCJ02坐标 * @param double $lat 纬度 * @param double $lng 经度 ...

  8. 微信小程序--百度地图坐标转换成腾讯地图坐标

    最近开发小程序时出现一个问题,后台程序坐标采用的时百度地图的坐标,因为小程序地图时采用的腾讯地图的坐标系,两种坐标有一定的误差,导致位置信息显示不正确.现在需要一个可以转换两种坐标的方法,经过查询发现 ...

  9. 安卓调用百度地图api 错误 mcode参数不存在

    自己的手机app里用到了百度地图sdk,希望根据手机获得的坐标来逆向到百度地图的坐标. 根据api文档拼写了url,因为是移动端,说是要添加mcode参数,然后我的url看起来如下: http://a ...

随机推荐

  1. MySQL 数据库设计总结

    本文由云+社区发表 作者:漆洪凯 规则1:一般情况可以选择MyISAM存储引擎,如果需要事务支持必须使用InnoDB存储引擎. 注意:MyISAM存储引擎 B-tree索引有一个很大的限制:参与一个索 ...

  2. docker-compose使用备忘(转)

    Docker-Compose简介 Docker-Compose项目是Docker官方的开源项目,负责实现对Docker容器集群的快速编排. Docker-Compose将所管理的容器分为三层,分别是工 ...

  3. C# T4 模板 数据库实体类生成模板(带注释，娱乐用)

     说明:..,有些工具生成实体类没注释,不能和SqlServer的MS_Description属性一起使用,然后照着网上的资源,随便写了个生成模板,自娱自乐向,其实卵用都没有参考教程    1.htt ...

  4. SpringMVC+Spring+Mybatis整合

    SpringMVC+Spring+Mybatis整合 导包 配置jdbc.properties.log4j.properties jdbc.driver=com.mysql.jdbc.Driver j ...

  5. iframe 父页面调用子页面的vue方法

                    父页面代码:            html: <div id="app"> //省略业务代码x行..... <iframe sr ...

  6. php中读取中文文件夹及文件报错

    php读取时出现中文乱码 一般php输出中出现中文乱码我们可用 header ('content:text/html;charset="utf-8"'); php中读取中文文件夹及 ...

  7. 碰到了通过Movie显示gif图片，有部分图片的duration为0导致gif只显示第一帧

    解决办法,改为使用android-gif-drawable.jar来显示gif图片(需要配合com.android.support:support-v4:18.0.0使用) GifImageView ...

  8. MySQL 基础知识梳理学习（五）----半同步复制

    1.半同步复制的特征 (1)从库会在连接到主库时告诉主库,它是不是配置了半同步. (2)如果半同步复制在主库端是开启了的,并且至少有一个半同步复制的从节点,那么此时主库的事务线程在提交时会被阻塞并等待 ...

  9. 【视频】设计模式(C++)视频讲解

    设计模式(C++) 视频网址: http://www.qghkt.com/ 设计模式(C++)视频地址: https://ke.qq.com/course/318637?tuin=a508ea62 目 ...

  10. Go语言打造以太坊智能合约测试框架（level2）

    传送门: 柏链项目学院 第二课 智能合约自动化编译 前期内容回顾 之前我们的介绍的是如何通过solc编译智能合约,并且调用智能合约,本节我们继续实践,将智能合约的代码自动化编译以及abi文件生成搞定. ...