html5之调用百度地图

<!DOCTYPE html> <html> <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />     <title>百度地图API地点搜索-获取经纬度DEMO</title>     <meta name="description" content="百度地图地点搜索和鼠标点击地点获取经纬度,这些都是地图比较基本和实用的代码,其中还包括了根据用户IP进行地图的显示、改变地图上的鼠标样式、启用滚轮缩放" />     <meta name="keywords" content="百度地图,地点搜索,获取经纬度,改变地图鼠标样式,启用滚轮缩放" />     <script type="text/javascript" src="‘>http://api.map.baidu.com/api?v=1.2"></script> </head> <body> <form action="" method="get">     <label >地点:</label>     <input id="where" name="where" type="text" >     <input type="button" value="地图上找" onClick="sear(document.getElementById(‘where‘).value);" />     <br />     <div style="width:520px;height:340px;border:1px solid gray" id="container"></div>     <br />     经纬度:     <input id="lonlat" name="lonlat" type="text"> </form> <script type="text/javascript">     var map = new BMap.Map("container");//在指定的容器内创建地图实例     map.setDefaultCursor("crosshair");//设置地图默认的鼠标指针样式     map.enableScrollWheelZoom();//启用滚轮放大缩小,默认禁用。     map.centerAndZoom(new BMap.Point(116.124878, 24.309178), 13);     map.addControl(new BMap.NavigationControl());     map.addEventListener("click", function(e){//地图单击事件         document.getElementById("lonlat").value = e.point.lng + ", " + e.point.lat;     });     function iploac(result){//根据IP设置地图中心         var cityName = result.name;         map.setCenter(cityName);     }     var myCity = new BMap.LocalCity();     myCity.get(iploac);//根据ip设置地图中心     function sear(result){//地图搜索         var local = new BMap.LocalSearch(map, {             renderOptions:{map: map}         });         local.search(result);     } </script>

</body> </html>

html5之调用百度地图,布布扣,bubuko.com

html5之调用百度地图

上一篇:php正则


下一篇:【Eclipse提高开发速度-插件篇】安装VJET插件,JS等提示开发插件