百度地图API实现地图定位

1、引用JS:

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

2、HTML:

东经:
<input name="longitude" onkeyup="dingwei()"  value="@row["longitude"].ToString()" type="text"/>
<span class="valid nullable" rule="number" msg="请填写数字"></span>
北纬:
<input name="latitude"  onkeyup="dingwei()"  value="@row["latitude"].ToString()" type="text"/>
<span class="valid nullable" rule="number" msg="请填写数字"></span>

3、JS代码:

<script type="text/javascript">
    var map;
    var level = 17;
    var marker;

    $(function () {
        //地图定位
        map = new BMap.Map("map");
        var top_right_navigation = new BMap.NavigationControl({ anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL }); //右上角,仅包含平移和缩放按钮
        map.addControl(top_right_navigation);
        map.addEventListener("zoomend", function () {
            level = map.getZoom();
        });
        var point = new BMap.Point(117.218, 31.861);
        map.centerAndZoom(point, level);
        marker = new BMap.Marker(point, { enableDragging: true });
        marker.addEventListener("dragging", function (evt) {
            $("input[name=‘longitude‘]").val(evt.point.lng)
            $("input[name=‘latitude‘]").val(evt.point.lat)
        });
        map.addOverlay(marker);
        dingwei();
    });

    //地图定位
    function dingwei() {
        if (SimpoValidate.valid()) { //验证输入
            var inputlongitude = $("input[name=‘longitude‘]");
            var inputlatitude = $("input[name=‘latitude‘]");
            if ($.trim(inputlongitude.val()) != ""
                && $.trim(inputlatitude.val()) != "") {
                var longitude = parseFloat(inputlongitude.val());
                var latitude = parseFloat(inputlatitude.val());
                var point = new BMap.Point(longitude, latitude);
                map.centerAndZoom(point, level);
                marker.setPosition(point);
            }
        }
    }
</script>

时间: 2024-08-10 03:54:03

百度地图API实现地图定位的相关文章

HTML5调用百度地图API进行地理定位实例

自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图API进行地理定位实例.请看下面代码: <!DOCTYPE html> <html> <title>HTML5调用百度地图API进行地理定位实例</title> <head> <meta http-equiv="Content-Type&

如何利用【百度地图API】进行定位?非GPS定位

原文:如何利用[百度地图API]进行定位?非GPS定位 如果你可以上网,如果你有火狐浏览器,那么恭喜你.你能很容易使用以下代码进行定位! ------------------------------------------------------------------------------- 百度地图API是一套由JavaScript语言编写的应用程序接口,它能够帮助您在网站中构建功能丰富.交互性强的地图应用程序. 其中,有Geolocation这个类,可以帮助你进行定位. 它的原理是,利用

网页嵌入百度地图和使用百度地图api自定义地图的详细步骤

在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api.具体使用方法如下: 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/creatmap/,搜索出自己要展示的位置,如下图所示. 第二步:设置地图,大家可以对网站显示地图的宽高进行设置,其余选项不动. 第三步:添加标注.点击第一个图标后,在右侧找到自己的位置,单击鼠标左键可定位.标记图标处可更换图标形状,名称和备注填入位置相关信息. 第四步:获取代码.将代码贴到你的网页

百度地图API自定义地图

<!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-Typ

关于百度地图API的地图坐标转换问题

原文:关于百度地图API的地图坐标转换问题 我在之前的文章利用html5获取经纬度并且在百度地图中显示位置中使用了百度地图的API来显示html5获取的地理位置,在文中我说过这样的话,我说百度地图的准确度不怎么精确,偏差很大.这里我要更正下: 国际经纬度坐标标准为WGS-84,国内必须至少使用国测局制定的GCJ-02,对地理位置进行首次加密.百度坐标在此基础上,进行了BD-09二次加密措施,更加保护了个人隐私.百度对外接口的坐标系并不是GPS采集的真实经纬度,需要通过坐标转换接口进行转换. 由此

百度地图API的IP定位城市和浏览器定位(转)

百度地图API提供了Geolocation 和 LocalCity两个服务类. 这俩API可以分别供用户在JavaScript中进行定位和城市确认. 1 本质上,Geolocation这个类是使用了支持HTML5浏览器提供的Geolocation API 来进行定位的.目前Internet Explorer 9.Firefox.Chrome.Safari 以及 Opera 支持地理定位(因为他们支持HTML5). 2 本质上,LocalCity这个类是利用用户IP地址去百度数据库里查询得到IP所

PHP利用百度地图API进行IP定位和GPS定位

最近在做一个手机端的webapp地图应用,而核心内容当然是定位了,但是定位的话有几种方式,IP定位,GPS定位,基站定位(这个貌似webapp用不了), 那么剩下核心的gps定位和ip定位了,我们知道,html5有定位API,但是该API拿到的GPS数据是硬件坐标,无法直接显示在地图上. 后来上百度LBS云看到有地图IP定位API和GPS坐标转换API,地址:http://developer.baidu.com/map/ 百度地图API的调用需要申请KEY,这里就不具体介绍了,直接贴上本人写了两

ionic 调用百度地图API,并定位当前位置示例

首先,可以参考JS版本的百度地图API示例. 由于在ionic程序中,我们一般使用的ES5 或 ES6 或者是Typescript. 这与JS 还有有一些区别的.所以,在我们的程序中,代码与官方示例代码格式上不完全相同. 下面,简单说明一下如何在 ionic 程序中 调用 百度地图API. 1. 在ionic程序中,定位到文件: \src\index.html.  添加如下代码 , 注意将"您的密钥" 替换成 您申请的密钥 <script type="text/java

php用百度地图API进行IP定位和GPS定位

<?php /** * 根据地理坐标获取国家.省份.城市,及周边数据类(利用百度Geocoding API实现) * 百度密钥获取方法:http://lbsyun.baidu.com/apiconsole/key?application=key(需要先注册百度开发者账号) * Date: 2015-07-30 * Author: fdipzone * Ver: 1.0 * * Func: * Public getAddressComponent 根据地址获取国家.省份.城市及周边数据 * Pri

调用百度地图 API 移动地图时 maker 始终在地图中间 并根据maker 经纬度 返回地址

1.项目要求如题目 2.废话不说-----代码如下: <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