标签：
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<script type="text/javascript"
src="http://api.map.baidu.com/api?v=2.0&ak=iT6QaeLCIoGgZCrG4bUEM598"></script>
<script type="text/javascript"
src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
<link rel="stylesheet"
href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
<div class="wp">
<div class="nearby_hospital">
<ul class="nearby_hospital_box">
<c:choose>
<c:when test="${empty hl}">
<div class="signal_source_my">
<div class="signal_source_my_l">
<h5>暂无附近医院</h5>
</div>
<div class="clear_float"></div>
</div>
</c:when>
<c:otherwise>
<div class="hospital_position">
<h4>
<a id="sdata">查看地图</a>
</h4>
<h4>
<a id="sdatahos">查看列表</a>
</h4>
<h4>
<small id="address">当前位置：${address}</small>
</h4>
<a id="updata"></a>
</div>
<div id="hoslist">
<c:forEach items="${hl}" var="hl" varStatus="vs">
<li><a
href="${basePath}department/listByHospitalId.htm?hospitalId=${hl.id}&privateHospital114=${hl.privateHospital114}"><h4>${hl.name}</h4>
</a> <span class="time_span">放号时间${hl.fhtime}</span> <span
class="km_span">距离：${hl.distance}公里</span><a
href="${basePath}department/listByHospitalId.htm?hospitalId=${hl.id}&privateHospital114=${hl.privateHospital114}"
class="more_hospital"></a>
</li>
</c:forEach>
</div>
</c:otherwise>
</c:choose>
</ul>
</div>
<div style="min-height:500px; width: 100%" id="map"></div>
</div>
<script type="text/javascript">
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for ( var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
var lon = theRequest[‘Longitude‘];
var lat = theRequest[‘Latitude‘];
//alert("我的经纬度" + lon + "---" + lat);
var markerArr = ${str};
function map_init() {
var map = new BMap.Map("map"); // 创建Map实例
var point = new BMap.Point(lon, lat); //地图中心点
map.centerAndZoom(point, 14); // 初始化地图,设置中心点坐标和地图级别。
map.enableScrollWheelZoom(true); //启用滚轮放大缩小
//地图、卫星、混合模式切换
map.addControl(new BMap.MapTypeControl({
mapTypes : [ BMAP_NORMAL_MAP, BMAP_SATELLITE_MAP,
BMAP_HYBRID_MAP ]
}));
//向地图中添加缩放控件
var ctrlNav = new window.BMap.NavigationControl({
anchor : BMAP_ANCHOR_TOP_LEFT,
type : BMAP_NAVIGATION_CONTROL_LARGE
});
map.addControl(ctrlNav);
//向地图中添加缩略图控件
var ctrlOve = new window.BMap.OverviewMapControl({
anchor : BMAP_ANCHOR_BOTTOM_RIGHT,
isOpen : 1
});
map.addControl(ctrlOve);
//向地图中添加比例尺控件
var ctrlSca = new window.BMap.ScaleControl({
anchor : BMAP_ANCHOR_BOTTOM_LEFT
});
map.addControl(ctrlSca);
var point = new Array(); //存放标注点经纬信息的数组
var marker = new Array(); //存放标注点对象的数组
var info = new Array(); //存放提示信息窗口对象的数组
var searchInfoWindow = new Array();//存放检索信息窗口对象的数组
for ( var i = 0; i < markerArr.length; i++) {
var p0 = markerArr[i].longitude; //
var p1 = markerArr[i].latitude; //按照原数组的point格式将地图点坐标的经纬度分别提出来
point[i] = new window.BMap.Point(p0, p1); //循环生成新的地图点
marker[i] = new window.BMap.Marker(point[i]); //按照地图点坐标生成标记
map.addOverlay(marker[i]);
//marker[i].setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
var label = new window.BMap.Label(markerArr[i].title, {
offset : new window.BMap.Size(20, -10)
});
marker[i].setLabel(label);
// 创建信息窗口对象
info[i] = "<p style=’font-size:12px;lineheight:1.8em;’>"
//+ "<img src=../hps/default/" + markerArr[i].id +".jpg style="float:right;zoom:1;overflow:hidden;width:100px;height:100px;margin-left:3px;"/>"
+ "</br>地址：" + markerArr[i].addr + "</br> 电话：" + 114
+ "</br></p>";
//创建百度样式检索信息窗口对象
searchInfoWindow[i] = new BMapLib.SearchInfoWindow(map,
info[i], {
title : markerArr[i].title, //标题
width : 290, //宽度
height : 70, //高度
panel : "panel", //检索结果面板
enableAutoPan : true, //自动平移
searchTypes : [ BMAPLIB_TAB_SEARCH, //周边检索
BMAPLIB_TAB_TO_HERE, //到这里去
BMAPLIB_TAB_FROM_HERE //从这里出发
]
});
//添加点击事件
marker[i].addEventListener("click", (function(k) {
// js 闭包
return function() {
//map.centerAndZoom(point[k], 18);
//marker[k].openInfoWindow(info[k]);
searchInfoWindow[k].open(marker[k]);
}
})(i));
}
}
//异步调用百度js
function map_load() {
var load = document.createElement("script");
load.src = "http://api.map.baidu.com/api?v=2.0&ak=IDvNBsejl9oqMbPF316iKsXR&callback=map_init";
document.body.appendChild(load);
}
window.onload = map_load;
//获取当前地址信息
$
.ajax({
url : "${basePath}hospital/getadder.htm?",
type : "POST",
data : {
Longitude : lat,
Latitude : lon
},
success : function(data) {
document.getElementById(‘address‘).innerHTML = "当前位置："
+ data;
},
error : function() {
document.getElementById(‘address‘).innerHTML = "当前位置：暂时无法获得您的地理位置";
},
});
}
</script>
<script type="text/javascript">
//map
$("#sdata").click(function() {
$(‘#sdata‘).hide();
$(‘#allmap‘).show();
$(‘#sdatahos‘).show();
$(‘#hoslist‘).hide();
});
//list
$("#sdatahos").click(function() {
$(‘#sdata‘).show();
$(‘#allmap‘).hide();
$(‘#sdatahos‘).hide();
$(‘#hoslist‘).show();
});
</script>
<script type="text/javascript">
$(‘#sdatahos‘).hide();
//$(‘#hoslist‘).hide();
$(‘#allmap‘).hide();
</script>
标签：
原文地址：http://my.oschina.net/u/587105/blog/362680
