<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>调用百度地图接口单击获取地图的经纬度和定位特效-xw素材网</title>
<script src="http://api.map.baidu.com/api?v=2.0&ak=12610de17164d36ae93d38596b0e2399"></script>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}
.demo{width:850px;margin:20px auto;}
#l-map{height:400px;width:600px;float:left;border:1px solid #bcbcbc;}
#r-result{height:400px;width:230px;float:right;}
</style>
</head>
<body>

<div class="demo">
<p style="height:40px;">
输入城市:<input id="txtCity" type="text"/> <button onClick="getPoint()">获取坐标</button>
坐标:<input id="txtPoint" type="text"/>
</p>
<div id="l-map"></div>
<div id="r-result">

</div>
</div>

<script type="text/javascript">
// 百度地图API功能

var map = new BMap.Map("l-map"); // 创建Map实例
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
map.enableScrollWheelZoom();
var local = new BMap.LocalSearch("全国", {
renderOptions: {
map: map,
panel : "r-result",
autoViewport: true,
selectFirstResult: false
}
});

map.addEventListener("click",function(e){
document.getElementById("txtPoint").value=e.point.lng + "," + e.point.lat;
});
// 定义一个控件类,即function
function ZoomControl(){
// 设置默认停靠位置和偏移量
this.defaultAnchor = BMAP_LINE_TYPE_BUS;
this.defaultOffset = new BMap.Size(10, 10);
}
// 通过JavaScript的prototype属性继承于BMap.Control
ZoomControl.prototype = new BMap.Control();
function getPoint(){
var city = document.getElementById("txtCity").value;
local.search(city);

}

</script>

</body>
</html>

百度API的更多相关文章

  1. 百度API ; 很多有用的接口及公用 数据

    百度API : http://apistore.baidu.com/ . 比如手机号码:

  2. 去百度API的百度地图准确叠加和坐标转换的解决方案研究

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 目前项目上如果要使用百度地图,得加载百度的开发包,然后通过百 ...

  3. 利用百度API Store接口进行火车票查询

    火车票查询 项目源码下载链接: Github:https://github.com/VincentWYJ/TrainTicketQuery 博客文件:http://files.cnblogs.com/ ...

  4. 百度api短信开发

    公司原来有一个短信发送的功能,是调用第三方的,但是很不稳定,时不时就收不到短信,但是钱已经扣了.对于这样的事,谁都忍受不了的.于是想找一个稳定短信发送平台,第一想到的是阿里云,百度.在这两个平台上公司 ...

  5. html5获取经纬度,百度api获取街区名,并使用JS保存进cookie

    引用js<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...

  6. 百度API使用--javascript api进行多点定位

    使用百度地图提供的javascript api,给定多点的经纬度坐标,在百度地图上 显示这些坐标点. 其中包括各个点自适应地图显示,自定义坐标点的图标,以及各个点之间添加折线. 实现的效果如下图: 具 ...

  7. PHP学习笔记:利用百度api实现手机归属地查询

    从来没有用过api,都不知道怎么获得api的数据,跟着demo,然后修改,终于实现了手机号码查询的功能,代码和说明很全,大家试试. <?php /** * Created by jianqing ...

  8. 【百度地图API】百度API卫星图使用方法和卫星图对比工具

    原文:[百度地图API]百度API卫星图使用方法和卫星图对比工具 百度地图API推出卫星图接口也有一个月啦~ 本文除了介绍如何使用百度地图API来操作卫星图外,还顺带制作了个卫星图对比工具. 一.百度 ...

  9. 【转】百度API获取城市名地名(附源码)

    在做一个软件时,用到了定位功能.网上有很多关于google 的GPS定位,但网上关于google定位都没有用, 搜索下原因:(这里建议大家在中国就尽量不使用系统自带的定位) 因为Google的服务器不 ...

  10. HTML5根据浏览器获取经度和纬度(百度API)

    网页获取用户位置信息的办法1 调用百度地图的地图标注功能,通过百度地图API获取对应的经度和纬度进而获取地区信息 优点是比较准确,缺点是需要用户自己选择位置2 通过H5 geolocation属性获取 ...

随机推荐

  1. 简谈百度坐标反转至WGS84的三种思路

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景 基于百度地图进行数据展示是目前项目中常见场景,但是因为百度地图 ...

  2. 承接Unity3D外包公司 — 技术分享

    Cardboard SDK for Unity的使用 上一篇文章作为系列的开篇,主要是讲了一些虚拟现实的技术和原理,本篇就会带领大家去看一看谷歌的Cardboard SDK for Unity,虽然目 ...

  3. hdu 3236 二维背包

    明天来一发 hdu 4501  算是这题的简化版吧

  4. The Parallel Challenge Ballgame[HDU1101]

    The Parallel Challenge Ballgame Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K ( ...

  5. 使用C#访问SQLLite

    1.SQLLite如何集成在C#中 2.相关C#与SQLLite资源,及说明 3.简单示例

  6. android OOM分析工具LeakCanary

    http://my.oschina.net/u/255456/blog/523659?fromerr=oGosxKBf LeakCanary 只是探测到可能出现内存泄露,然后dump 一个java h ...

  7. poj2826An Easy Problem?!

    链接 繁琐细节题. 1.线段无交点时,ans=0; 2.如图 假设过p3.y的水平线与p1p2相交 因为雨是垂直下落的,左图的情况是无法收集到雨水的,而这种情况有一种简便的判定方式 cross(p1- ...

  8. hdu----(5050)Divided Land(二进制求最大公约数)

    Divided Land Time Limit: 8000/4000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tota ...

  9. Oracle:使用过程中的问题集锦

    导读:在使用Oracle的过程中,又频繁的出问题.突然间就连接不上,各种报错了.在此,将问题给记录下来,方便以后查看. 一.ora 12514监听程序当前无法识别 之前一直链接使用的好好的,突然就连接 ...

  10. win7 mount到Linux下无法分配内存的问题(Cannot allocate memory)

    如题,我在win7系统下共享目录,mount到linux下,进行编译或者某些操作,出现Cannot allocate memory提示. 修改以下两个键值,然后重启server服务,可以解决这个问题: ...