百度地图定位

百度地图定位

<div class="map">
				<img src="/Application/Home/View/default/pages/resource/images/map.jpg"  width="490px;"height="320px;"  />
				引用百度地图API
					<style type="text/css">
						html,body{margin:0;padding:0;}
						.iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
						.iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
					</style>
					<script type="text/javascript" src="http://api.map.baidu.com/api?key=&amp;v=1.1&amp;services=true"></script><script type="text/javascript" src="http://api.map.baidu.com/getscript?v=1.1&amp;ak=&amp;services=true&amp;t=20130716024058"></script><link rel="stylesheet" type="text/css" href="http://api.map.baidu.com/res/11/bmap.css">
					
					
					
					  百度地图容器
					  <div style="width: 1349px; height: 202px; border: 1px solid rgb(204, 204, 204); margin: 0px auto; overflow: hidden; position: relative; z-index: 0; color: rgb(0, 0, 0); text-align: left; background-image: url(&quot;http://api.map.baidu.com/images/bg.png&quot;);" id="dituContent"><div id="platform" style="overflow: visible; position: absolute; z-index: 0; left: 0px; top: 0px; cursor: url(&quot;http://api.map.baidu.com/images/openhand.cur&quot;) 8 8, default;"><div id="mask" class=" BMap_mask" style="position: absolute; left: 0px; top: 0px; z-index: 9; overflow: hidden; -webkit-user-select: none; width: 490px; height: 320px;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 800;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 700;"><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; width: 23px; height: 25px; left: 235px; top: 135px; z-index: -8172866; background: url(&quot;http://api.map.baidu.com/images/blank.gif&quot;);" title=""></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 600;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 500;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 400;"><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 245px; top: 160px; z-index: -8172866;"><div style="position: absolute; margin: 0px; padding: 0px; width: 23px; height: 25px; left: -10px; top: -25px; overflow: hidden;"><img src="http://api.map.baidu.com/images/marker_red.png" style="border:none;left:0px; top:0px; position:absolute;"></div></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"></div></div><div style="position: absolute; z-index: -1; left: 245px; top: 160px;"><img src="http://online3.map.bdimg.com/tile/?qt=tile&amp;x=26687&amp;y=9696&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -425px; top: -366px;"><img src="http://online3.map.bdimg.com/tile/?qt=tile&amp;x=26688&amp;y=9695&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -169px; top: -110px;"><img src="http://online3.map.bdimg.com/tile/?qt=tile&amp;x=26689&amp;y=9694&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 87px; top: 146px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&amp;x=26687&amp;y=9695&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -425px; top: -110px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&amp;x=26688&amp;y=9694&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -169px; top: 146px;"><img src="http://online4.map.bdimg.com/tile/?qt=tile&amp;x=26689&amp;y=9695&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 87px; top: -110px;"><img src="http://online4.map.bdimg.com/tile/?qt=tile&amp;x=26688&amp;y=9696&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -169px; top: -366px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&amp;x=26687&amp;y=9694&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -425px; top: 146px;"><img src="http://online0.map.bdimg.com/tile/?qt=tile&amp;x=26689&amp;y=9696&amp;z=17&amp;styles=pl&amp;udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 87px; top: -366px;"></div></div><div id="zoomer" style="position:absolute;z-index:0;top:0px;left:0px;overflow:hidden;visibility:hidden;cursor:url(http://api.map.baidu.com/images/openhand.cur) 8 8,default"><div class="BMap_zoomer" style="top:0;left:0;"></div><div class="BMap_zoomer" style="top:0;right:0;"></div><div class="BMap_zoomer" style="bottom:0;left:0;"></div><div class="BMap_zoomer" style="bottom:0;right:0;"></div></div><div class=" anchorBL" style="height: 32px; position: absolute; z-index: 10; bottom: 0px; right: auto; top: auto; left: 1px;"><a title="到百度地图首页" target="_blank" href="http://map.baidu.com/?sr=1" style="outline: none;"><img style="border:none;width:77px;height:32px" src="http://api.map.baidu.com/images/copyright_logo.png"></a></div><div unselectable="on" class=" BMap_cpyCtrl anchorBL" style="cursor: default; white-space: nowrap; bottom: 2px; right: auto; top: auto; left: 81px; position: absolute; z-index: 10;"><span style="-webkit-text-size-adjust:none;color:#000;background:none;line-height:15px;font:11px arial,simsun" _cid="1">© 2015 Baidu</span></div><div unselectable="on" class=" BMap_stdMpCtrl BMap_stdMpType0 BMap_noprint anchorTL" style="width: 52px; height: 226px; bottom: auto; right: auto; top: 10px; left: 10px; position: absolute; z-index: 1100;"><div class="BMap_stdMpPan"><div class="BMap_button BMap_panN" title="向上平移"></div><div class="BMap_button BMap_panW" title="向左平移"></div><div class="BMap_button BMap_panE" title="向右平移"></div><div class="BMap_button BMap_panS" title="向下平移"></div><div class="BMap_stdMpPanBg BMap_smcbg"></div></div><div class="BMap_stdMpZoom" style="height: 167px; width: 52px;"><div style="height: 167px; width: 37px;"><div class="BMap_button BMap_stdMpZoomIn" title="放大一级"><div class="BMap_smcbg"></div></div><div class="BMap_button BMap_stdMpZoomOut" title="缩小一级"><div class="BMap_smcbg"></div></div></div><div class="BMap_stdMpSlider" style="height: 133px;"><div class="BMap_stdMpSliderBgTop" style="height: 124px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSliderBgBot" style="top: 124px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSliderMask" title="放置到此级别"></div><div class="BMap_stdMpSliderBar" title="拖动缩放" style="cursor: url(&quot;http://api.map.baidu.com/images/openhand.cur&quot;) 8 8, default; top: 8px;"><div class="BMap_smcbg"></div></div></div><div class="BMap_zlHolder hvr"><div class="BMap_zlSt"><div class="BMap_smcbg"></div></div><div class="BMap_zlCity"><div class="BMap_smcbg"></div></div><div class="BMap_zlProv"><div class="BMap_smcbg"></div></div><div class="BMap_zlCountry"><div class="BMap_smcbg"></div></div></div></div></div><div unselectable="on" class=" BMap_omCtrl BMap_noprint anchorBR quad4" style="width: 15px; height: 15px; bottom: 0px; right: 0px; top: auto; left: auto; position: absolute; z-index: 10;"><div class="BMap_omOutFrame" style="width: 149px; height: 149px;"><div class="BMap_omInnFrame" style="bottom: auto; right: auto; top: 8px; left: 8px; width: 139px; height: 139px;"><div class="BMap_omMapContainer"></div><div class="BMap_omViewMv" style="cursor: url(&quot;http://api.map.baidu.com/images/openhand.cur&quot;) 8 8, default;"><div class="BMap_omViewInnFrame"><div></div></div></div></div></div><div class="BMap_omBtn BMap_omBtnClosed" style="bottom: 0px; right: 0px; top: auto; left: auto;"></div></div><div unselectable="on" class=" BMap_scaleCtrl BMap_noprint anchorBL" style="bottom: 18px; right: auto; top: auto; left: 81px; width: 72px; position: absolute; z-index: 10;"><div class="BMap_scaleTxt" unselectable="on">100&nbsp;米</div><div class="BMap_scaleBar BMap_scaleHBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div><div class="BMap_scaleBar BMap_scaleLBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div><div class="BMap_scaleBar BMap_scaleRBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div></div></div>
					
					<script type="text/javascript">
						//创建和初始化地图函数:
						function initMap(){
							createMap();//创建地图
							setMapEvent();//设置地图事件
							addMapControl();//向地图添加控件
							addMarker();//向地图中添加marker
						}
						
						//创建地图函数:
						function createMap(){
							if("122.749794,40.864335".indexOf(",")>-1){
								var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
								var point = new BMap.Point(122.749794,40.864335);//定义一个中心点坐标
								map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器中
								window.map = map;//将map变量存储在全局
								var marker = new BMap.Marker(point);  // 创建标注
								map.addOverlay(marker);               // 将标注添加到地图中
								if("海城米格商贸有限公司" == ""){
									var opts = {
											  width : 200,     // 信息窗口宽度
											  height: 100,     // 信息窗口高度
											  title : "" , // 信息窗口标题
											  enableMessage:true,//设置允许信息窗发送短息
											}
								}
								else{
									var opts = {
											  width : 200,     // 信息窗口宽度
											  height: 70,     // 信息窗口高度
											  title : "海城米格商贸有限公司" , // 信息窗口标题
											  enableMessage:true,//设置允许信息窗发送短息
											}
								}
										var infoWindow = new BMap.InfoWindow("地址:辽宁省海城市老杏花村北18米<br />电话:14704222224", opts);  // 创建信息窗口对象 
										map.openInfoWindow(infoWindow,point); //开启信息窗口
										marker.addEventListener("click", function(){          
											map.openInfoWindow(infoWindow,point); //开启信息窗口
										});	
							}
							else
								{
								var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
								var point = new BMap.Point(105.530759, 36.206348);//定义一个中心点坐标
								map.centerAndZoom(point,4);//设定地图的中心点和坐标并将地图显示在地图容器中
								}
							/* var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
							var point = new BMap.Point(122.749794,40.864335);//定义一个中心点坐标
							map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器中
							window.map = map;//将map变量存储在全局
							var marker = new BMap.Marker(point);  // 创建标注
							map.addOverlay(marker);               // 将标注添加到地图中
							if("海城米格商贸有限公司" == ""){
								var opts = {
										  width : 200,     // 信息窗口宽度
										  height: 100,     // 信息窗口高度
										  title : "" , // 信息窗口标题
										  enableMessage:true,//设置允许信息窗发送短息
										}
							}
							else{
								var opts = {
										  width : 200,     // 信息窗口宽度
										  height: 100,     // 信息窗口高度
										  title : "海城米格商贸有限公司" , // 信息窗口标题
										  enableMessage:true,//设置允许信息窗发送短息
										}
							}
									var infoWindow = new BMap.InfoWindow("地址:辽宁省海城市老杏花村北18米中国消费服务网", opts);  // 创建信息窗口对象 
									marker.addEventListener("click", function(){          
										map.openInfoWindow(infoWindow,point); //开启信息窗口
									}); */
						}
						
						//地图事件设置函数:
						function setMapEvent(){
							map.enableDragging();//启用地图拖拽事件,默认启用(可不写)
							map.enableScrollWheelZoom();//启用地图滚轮放大缩小
							map.disableDoubleClickZoom();//禁用鼠标双击放大
							map.enableKeyboard();//启用键盘上下左右键移动地图
						}
						
						//地图控件添加函数:
						function addMapControl(){
							//向地图中添加缩放控件
						var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
						map.addControl(ctrl_nav);
							//向地图中添加缩略图控件
						var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:0});
						map.addControl(ctrl_ove);
							//向地图中添加比例尺控件
						var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
						map.addControl(ctrl_sca);
						}
						
						initMap();//创建和初始化地图 
					</script>
			</div>



回复列表



回复操作

正在加载验证码......

请先拖动验证码到相应位置