<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. 把项目中那些恶心的无处存储的大块数据都丢到FastDFS之快速搭建

        在我们开发项目的时候,经常会遇到大块数据的问题(2M-100M),比如说保存报表中1w个人的ID号,他就像一个肿瘤一样,存储在服务器哪里都 觉得恶心,放在redis,mongodb中吧,一下子 ...

  2. 重建程序员能力(3)-asp.net MVC框架增加Controller

        MVC在微软中提供的框架目前只是发现是asp.net用.另 8年前,我做了个MVC的Windows APP框架如果有兴趣我日后会介绍给大家,欢迎大家关注.MVC的概念网站上有很多,大家去查阅一 ...

  3. （四） Keras Dropout和正则化的使用

    视频学习来源 https://www.bilibili.com/video/av40787141?from=search&seid=17003307842787199553 笔记 使用drop ...

  4. odoo12 物流 自动计算运费 ，采购销售使用不同计量单位自动换算

    在物流和食品生鲜类行业,重量是很重要的因素,不仅要处理产品的数量,也要处理产品的重量.在多数行业,重量也是订单的重要数据. odoo原生包含了对重量的处理,下文中将指导如何优雅应用odoo原生模块处理 ...

  5. 阅读笔记：基础知识（Java篇）

    1. GC机制(垃圾回收机制) 找到垃圾的方法:引用计数法.可达性分析法 回收垃圾的方法:标记清除算法.复制算法.标记整理法.分代算法 2. JVM内存划分 线程私有:程序计数器.JVM虚拟机栈.本地 ...

  6. ElasticSearch、Logstash、Kibana 搭建高效率日志管理系统

    ELK (ElasticSearch.LogStash以及Kibana)三者组合是一个非常强大的工具,这里我们来实现监控日志文件并且收到日志到ElasticSearch搜索引擎,利用Kibana可视化 ...

  7. mssql sqlserver 自动备份存储过程的方法分享

    转自:http://www.maomao365.com/?p=7847摘要: 为了更好的记录数据库中存储过程脚本的变化情况,下文采用数据库触发器来自动记载每次“存储过程”的变化(新增或修改),如下所示 ...

  8. C++设计模式视频讲解

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

  9. Orchard克死你 之 刚起步

    从去年开始,一直想琢磨一个比较灵活的.Net框架用,经一个月的地毯式搜寻,把目标定位到2009年的微软开源项目Orchard,虽然起步甚晚,但对我们这些菜鸟,仍旧是有可学习之处,所以打算花大半年时间想 ...

  10. 自研数据库CynosDB存储系统如何实现即时恢复

    本文由云+社区发表 本文作者:许中清,腾讯云自研数据库CynosDB的分布式存储CynosStore负责人.从事数据库内核开发.数据库产品架构和规划.曾就职于华为,2015年加入腾讯,参与过TBase ...