GPS坐标转百度地图并且加载地图示例.支持微信端访问

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Wx_VehicleLocation.aspx.cs" Inherits="DTMS.WeiXin.wxmgr.govmgr.Wx_VehicleLocation" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <!-- #手机浏览器兼容性设置 -->

    <meta content="application/xhtml+xml;charset=UTF-8" http-equiv="Content-Type">

    <meta content="no-cache,must-revalidate" http-equiv="Cache-Control">

    <meta content="no-cache" http-equiv="pragma">

    <meta content="0" http-equiv="expires">

    <meta content="telephone=no" name="format-detection" />

    <meta content="width=1, initial-scale=1" name="viewport">

    <title>车辆位置</title>

    <link href="../../skin/weui/dist/style/weui.min.css" rel="stylesheet" />

    <script src="../../Scripts/jquery-1.9.1.min.js"></script>

    <style type="text/css">

        #allmap {

            width: 50%;

            height: 50%;

            overflow: hidden;

            margin: 0;

            font-family: "微软雅黑";

        }

    </style>

</head>

<body>

    <div class="weui_search_bar" id="search_bar">

        <form class="weui_search_outer" method="post">

            <div class="weui_search_inner">

                <i class="weui_icon_search"></i>

                <input type="search" class="weui_search_input" id="search_input" placeholder="输入车牌号码中间四位数字" required />

                <a href="javascript:" class="weui_icon_clear" id="search_clear"></a>

            </div>

            <label for="search_input" class="weui_search_text" id="search_text">

                <i class="weui_icon_search"></i>

                <span>车辆检索</span>

            </label>

        </form>

        <a href="javascript:" class="weui_search_cancel" id="search_cancel">取消</a>

    </div>

    <div id="vehicleInfo" class="weui_cells weui_cells_access search_show">

    </div>

    <div id="content" class="content">

        <div style="height: 500px; border: 0px solid gray" id="container"></div>

    </div>

</body>

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

<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>

<%--百度地图坐标转换js--%>

<script type="text/javascript">

    //根据经纬度获取具体的地名

    function getAddressByLn() {

        var address = "";

        var map = new BMap.Map("container");

        var gpsPoint = new BMap.Point(ln, la);

        alert("" + ln + "la" + la);

        map.centerAndZoom(gpsPoint, 15);

        map.enableScrollWheelZoom();    //启用滚轮放大缩小，默认禁用

        map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用

        //添加鼠标滚动缩放

        map.enableScrollWheelZoom();

        //添加缩放平移控件

        map.addControl(new BMap.NavigationControl());

        setTimeout(function () {

            BMap.Convertor.translate(gpsPoint, 0, translateCallback);     //真实经纬度转成百度坐标

        }, 1000);

        //坐标转换完之后的回调函数

        translateCallback = function (bdpoint) {

            var gc = new BMap.Geocoder();

            var hh = ("ln" + ln + "la" + la);

            gc.getLocation(bdpoint, function (rs) {

                var addComp = rs.addressComponents;

                address = ("" + addComp.district + addComp.street + addComp.streetNumber);

                $("#vehicleLocation").append("<div css='weui_cell' id='adre'><div class='weui_cell_bd weui_cell_primary'>最新位置:" + address + hh + "附近</div</div>");

                //设置标注的图标

                var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {

                    offset: new BMap.Size(10, 25), // 指定定位位置

                    imageOffset: new BMap.Size(0, 0 - 10 * 25) // 设置图片偏移

                });

                var marker = new BMap.Marker(bdpoint, { icon: myIcon });

                //把标注添加到地图上

                map.addOverlay(marker);

                alert("转化为百度坐标为：" + bdpoint.lng + "," + bdpoint.lat);

            });

        }

    }

</script>

</html>

GPS坐标转百度地图并且加载地图示例.支持微信端访问的更多相关文章

百度地图-省市县联动加载地图分类： Demo JavaScript 2015-04-26 13:08 530人阅读评论(0) 收藏
在平常项目中,我们会遇到这样的业务场景: 客户希望把自己的门店绘制在百度地图上,通过省.市.区的选择,然后加载不同区域下的店铺位置. 先看看效果图吧: 实现思路: 第一步:整理行政区域表: 要实现通过 ...
PHP+百度地图API+JAVASCRIPT实现GPS坐标与百度坐标转换的实例
原文:PHP+百度地图API+JAVASCRIPT实现GPS坐标与百度坐标转换的实例  <!DOCTYPE html> <html&g ...
GPS坐标转换为百度地图坐标
/** * GPS坐标转换为百度地图坐标 * 需要引入javabase64.jar 和json的一些包 * */ public class Gps2BaiDu { public static void ...
GPS坐标换算为百度坐标
最近在做一个关于手机定位的小应用,需求是这样的,用户通过手机(Wp8)进行二维码扫描操作并且记录用户的当前位置,在PC上可以查看用户所在地图的位置,做法就是在用户扫描条码时,通过手机GPS获取当前在地 ...
GPS坐标换算为百度坐标(转)
最近在做一个关于手机定位的小应用,需求是这样的,用户通过手机(Wp8)进行二维码扫描操作并且记录用户的当前位置,在PC上可以查看用户所在地图的位置,做法就是在用户扫描条码时,通过手机GPS获取当前在地 ...
带你剖析WebGis的世界奥秘----瓦片式加载地图（转）
带你剖析WebGis的世界奥秘----瓦片式加载地图转:https://zxhtom.oschina.io/zxh/20160805.html 编程 java 2016/08/05 0留言, ...
解决ArcGIS API for Silverlight 加载地图的内外网访问问题
原文:解决ArcGIS API for Silverlight 加载地图的内外网访问问题先上一个类,如下: public class BaseClass { public static string ...
MapXtreme在asp.net中的使用之加载地图(转)
MapXtreme在asp.net中的使用之加载地图(转) Posted on 2010-05-04 19:44 Happy Coding 阅读(669) 评论(0) 编辑收藏 1.地图保存在本地的 ...
cocos2d-x游戏开发系列教程-坦克大战游戏加载地图的编写
上节课写了关卡选择场景,那么接下来写关卡内容,先写最基本的地图的加载我们新建一个场景类,如下所示: class CityScene : public cocos2d::CCLayer { publi ...

随机推荐

Unescape HTML entities in Javascript Unescape HTML转成html代码
前言: 在javascript里面动态创建标准dom对象一般使用: var obj = document.createElement('div'); 然后再给obj设置一些属性. 但是,在实际使用过程 ...
文件I/O之/dev/fd
较新的系统都提供名为/dev/fd的目录,其目录项是名为0.1.2等的文件.打开文件/dev/fd/n等效于复制描述符n(假定描述符n是打开的). 在下列函数调用中: fd = open( " ...
ajax调用webService中的方法
页面代码 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx. ...
mysql事务问题
mysql事务: 若mysql 开启事务后START TRANSACTION ,不显示提交commit,则默认自动回滚,而不是默认自动提交.
javascript笔记06：类的创建
1.创建一个javascript类---javascript使用函数形式构建类 <script type="text/javascript"> //定义一个类 ...
RadioGroup&RadioButton
RadioGroup提供多选一机制:属性orientation:“vertlcal” or “horizontal” @Override public void onCheckedChanged(Ra ...
Android_listView
package com.example.app5; import java.util.ArrayList; import java.util.HashMap; import java.util.Lis ...
圆满完成Web安全测试培训课程广州公开班！
圆满完成Web安全测试培训课程广州公开班! http://gdtesting.com/news.php?id=187 下期<Web安全测试最佳实践>公开课通知:8月9.10日地点:广州课 ...
深入理解计算机系统第二版习题解答CSAPP 2.17
假设w=4,我们能给每个可能的十六进制数字赋予一个数值,假设用一个无符号或者补码表示.完成下表: x 无符号(B2U(x)) 补码(B2T(x)) 十六进制二进制 0xE 1110 14 -2 0x ...
Android学习(一) - Activity
好久不写博客了,自上次写到现在已经一年多了,写这东西其实坚持下来就好了,将自己学的东西一点点写出来成为日后的积累查阅的资料.最近不是特别忙,抽点时间学学移动开发. Android组件中常用的四大组件 ...

GPS坐标转百度地图并且加载地图示例.支持微信端访问

GPS坐标转百度地图并且加载地图示例.支持微信端访问的更多相关文章

随机推荐

热门专题