根据地址查询经纬度IP(百度地图)

来源:互联网 发布:软件开发前期准备工作 编辑:程序博客网 时间:2024/04/19 19:02

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>根据地址查询经纬度</title>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script></head><body style="background:#CBE1FF">    <div style="width:730px;margin:auto;">           要查询的地址:<input id="text_" type="text" value="上海市徐汇区宜山路407号喜盈门国际大厦金座9-A" style="margin-right:100px;"/>        查询结果(经纬度):<input id="result_" type="text" />        <input type="button" value="查询" onclick="searchByStationName();"/>        <div id="container"             style="position: absolute;                margin-top:30px;                 width: 730px;                 height: 590px;                 top: 50;                 border: 1px solid gray;                overflow:hidden;">        </div>    </div><script type="text/javascript">    var map = new BMap.Map("container");    var localSearch = new BMap.LocalSearch(map);    localSearch.enableAutoViewport(); //允许自动调节窗体大小    function searchByStationName() {      var keyword = document.getElementById("text_").value;      localSearch.setSearchCompleteCallback(function (searchResult) {        var poi = searchResult.getPoi(0);        document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat; //获取经度和纬度,将结果显示在文本框中        map.centerAndZoom(poi.point, 13);        //给地图标注点        var point = new BMap.Point(poi.point.lng,poi.point.lat);        var marker = new BMap.Marker(point);// 创建标注map.addOverlay(marker);             // 将标注添加到地图中      });      localSearch.search(keyword);    }</script></body>

在线展示:http://codepen.io/dddddd1/pen/NbpegM

0 0
原创粉丝点击