cshtml:

<div class="modal" style="visibility: hidden">
<div id="map"></div>
</div> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=6713c5e605ec1fdcfbe108513da6cf49"></script>

Jquery:

 var map = new BMap.Map('map'), form = $('.form');
map.enableContinuousZoom();
map.enableKeyboard();
map.enableInertialDragging();
map.enableScrollWheelZoom();//启动鼠标滚轮放大缩小地图
map.addControl(new BMap.MapTypeControl());//添加地图类型控件,默认为地图右上方
map.addControl(new BMap.OverviewMapControl());//添加缩略地图控件,默认位于地图右下方,是一个可折叠的缩略地图。
map.addControl(new BMap.ScaleControl());//添加比例尺控件,默认位于地图左下方,显示地图的比例关系。
map.addControl(new BMap.NavigationControl());//添加地图平移缩放控件,PC端默认位于地图左上方,它包含控制地图的平移和缩放的功能。移动端提供缩放控件,默认位于地图右下方。 var dealerID = $('input[name="Dealer"]'), dealerDisplay = $('#dealerDisplay');
//获取全部维修站信息 function select(id, name) {
dealerID.val(id);
dealerDisplay.val(name);
$('.modal').click();
} $.get('dealers.aspx', function (dealers) {
dealers = eval(dealers);
for (var i = 0; i < dealers.length; i++) {
var dealer = dealers[i];
//若为已存在订单,显示已选择的维修站名称
if (dealerID.val() && dealerID.val() == dealer.ID) {
dealerDisplay.val(dealer.Name);
}
//初始化地图标注点
marker = new BMap.Marker(new BMap.Point(dealer.Longitude, dealer.Latitude));
//初始标注点化信息窗口
info = new BMap.InfoWindow("<h2>" + dealer.Name + "</h2><p>地址:" + dealer.Address + "<br/>未确认:" + dealer.Unaccepted + "&nbsp&nbsp&nbsp&nbsp维修中:" + dealer.Uncompleted + "<br/><a style=\"float:right\" name=\"select\" href=\"javascript:select('" + dealer.ID + "','" + dealer.Name + "')\">选择</a></p>");
marker.infoWindow = info;
//添加标注点事件,即点击标注点,即打开该标注点的信息窗口
marker.addEventListener('click', function (e) {
this.openInfoWindow(e.target.infoWindow);
})
map.addOverlay(marker);//添加标注点
}
});

网页显示百度地图 Jquery的更多相关文章

  1. 在iOS APP中使用H5显示百度地图时如何支持HTTPS?

    现象: 公司正在开发一个iOSAPP,使用h5显示百度地图,但是发现同样的H5页面,在安卓可以显示出来,在iOS中就显示不出来. 原因分析: 但是现在iOS开发中,苹果已经要求在APP中的所有对外连接 ...

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

    在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api.具体使用方法如下: 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/ ...

  3. Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图

      标签: Android百度地图API Key  分类: Android 百度地图开发(2)    最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地 ...

  4. openlayers3应用一:显示百度地图

    在项目中使用百度地图,最直接的方式是使用百度api,但是使用百度api需要申请key,并且某些功能调用有次数限制. 本文讲述在openlayers3中使用百度地图的方法.调用百度地图,也是经过了几番周 ...

  5. PC端网页嵌入百度地图

    1 打开百度地图生成器: http://api.map.baidu.com/lbsapi/creatmap/ 2 设置好了之后,点击获取代码,将代码粘贴到文件中保存为html文件 参考网址:https ...

  6. 百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法

    原文:百度地图API显示多个标注点,解决提示信息问题以及给标注增加地图旁的文字连接提示的另一种解决办法 公司的网站改版要求在一个页面显示百度地图.上面要同时显示很多标注点,标注点当然要有提示信息嘛,提 ...

  7. Android开发百度地图(一)--显示基本地图

    最近由于比赛的需要,自己学习了一下百度地图的开发.希望以下的内容能够对大家有用. 一.开发前的准备工作: 1.注册百度账号,并登录.(有百度账号的话直接登录) 2.申请Key,地址:http://de ...

  8. Angular/Vue调用百度地图+标注点不显示图标+多标注点计算地图中心位置

    整理一下~ 一.在vue中调用百度地图 首先当然是申请百度密匙(很简单,不多说) 1.在index.html文件中引入百度地图JavaScript API接口:   <script type=& ...

  9. android菜鸟学习笔记30----Android使用百度地图API(一)准备工作及在应用中显示地图

    1.准备工作: 百度地图API是免费开放的,但是需要申请API Key: 1)先注册一个百度开发者帐号 2)进入百度开放服务平台http://developer.baidu.com/ 3)进入LBS云 ...

随机推荐

  1. Oracle入门基础

    使用SQLplus工具登录连接 开始->运行CMD-> C:\Users\Admininstrator> sqlplus 请输入用户名:sys@orcl as sysdba 输入口令 ...

  2. jquery 页面加载时获取图片高度

    $(function () { $(window).load(function(){ alert($('img').height()); }); });

  3. 完整卸载 kubuntu-desktop from Ubuntu 14.04 LTS

    系统 ubuntu 14.04 LTS 64Bit 目的:卸载kubuntu-desktop 方法一: sudo apt-get remove libkde3support4 k3b-data ntr ...

  4. php入门引言

    php开发者要具备的一些要求: [1]html常用标签的基础知识 [2]html+css布局的基础知识 [3]了解php开发环境 [4]了解php标签和扩展名 1.php标签是撒??? <?ph ...

  5. 运行CUDA实例时候出现的问题

    问题一:>LINK : fatal error LNK1123: 转换到 COFF 期间失败:文件无效或损坏 将 项目——项目属性——配置属性——连接器——清单文件——嵌入清单 “是”改为“否” ...

  6. nefu 1029 字符串

    Description 给定一个字符串,现在要你从这个字符串中找到第一个只出现一次的字符 ,很简单吧! 快敲代码,动作! Input 多组输入,每行一个字符串(小写字母a~z)字符串长度不超过50 O ...

  7. linux下的打包与压缩

    linux压缩或解压缩工具有很多,除了已经很少有人使用的compress外,现在常用的还有tar,bzip2,xz 和gziplinux压缩或解压缩工具有很多,除了已经很少有人使用的compress外 ...

  8. 用git工作的流程

    1.       clone仓库: git clone git@github.com:test/test.git 2.       检出远程的develop分支 git checkout -b dev ...

  9. 几道比较有意思的js面试题

    1.[] ? !![] : ![];输出结果是什么? 1 2 3 4 5 let val = [] ? !![] : ![]; console.log(val);  //true: //之前的错误解释 ...

  10. 网站发布出现“未能找到路径“path\bin\roslyn\csc.exe”....“和拒绝访问的解决办法

    最近在2017上新建了一个MVC项目,发布是出现了各种奇怪的问题,其中一个错误是: 未能找到路径“path\bin\roslyn\csc.exe”.... 经过网上搜寻资料发现罪魁祸首就是NUGET里 ...