百度地图在java项目中的应用、搜索及定位点

此段代码是在java项目前台JS中引用百度地图进行固定点的定位以及位置的搜索功能：

<%@ page language="java" contentType="text/html; charset=GBK" pageEncoding="GBK"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<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 type="text/css">
		body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
	</style>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=kRHuqFbkaoDcf5CsmOY0fwl"></script>
	<title>地图展示</title>
</head>
<body onload="load()">
<%
    String scname = request.getParameter("scname");
    if (scname == null) {
        scname = "";
    } else {
        scname = new String(scname.getBytes("iso-8859-1"), "gbk");
    }
%>
	<form action="#">
		<input type="text" name="scname" value="<%=scname%>" id="scname" />
		<input type="submit" value="提交" />
	</form>
	<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">

	//使用HTTP 响应头信息中的 X-Frame-Options 属性防止网页被Frame
	(function () {
    		if (window != window.top) {
            	window.top.location.replace(window.location); //或者干别的事情
     		}
	})();

	//新建三个地图上点
	var points = [  
		{"lng":121.432148,"lat":31.215945,"url":"http://www.hyhouse.com/","id":1,"name":"华燕房盟"},
		{"lng":121.45708,"lat":31.25203,"url":"https://shhgkj9863.cn.china.cn/","id":2,"name":"华盖科技"},   
		{"lng":121.409411,"lat":31.178121,"url":"http://www.zhongxicpa.com/","id":3,"name":"中喜"},  
		{"lng":121.328515,"lat":31.099366,"url":"http://shtianxin.com/","id":3,"name":"天信网络"}  
	]; 
	//创建标注点并添加到地图中
	function addMarker(points) {
	    //循环建立标注点
	    for(var i=0, pointsLen = points.length; i<pointsLen; i++) {
	        var point = new BMap.Point(points[i].lng, points[i].lat); //将标注点转化成地图上的点
	        var marker = new BMap.Marker(point); //将点转化成标注点
	        map.addOverlay(marker);  //将标注点添加到地图上
	        //添加监听事件
	        (function() {
	            var thePoint = points[i];
	            marker.addEventListener("click",
	                function() {
	                showInfo(this,thePoint);
	            });
	         })();  
	    }
	}
	function showInfo(thisMarker,point) {
	    //获取点的信息
	    var sContent = '<ul style="margin:0 0 5px 0;padding:0.2em 0">'  
	    +'<li style="line-height: 26px;font-size: 15px;">'  
	    +'<span style="width: 50px;display: inline-block;">id：</span>' + point.id + '</li>'  
	    +'<li style="line-height: 26px;font-size: 15px;">'  
	    +'<span style="width: 50px;display: inline-block;">名称：</span>' + point.name + '</li>'  
	    +'<li style="line-height: 26px;font-size: 15px;"><span style="width: 50px;display: inline-block;">查看：</span><a href="'+point.url+'">详情</a></li>'  
	    +'</ul>';
	    var infoWindow = new BMap.InfoWindow(sContent); //创建信息窗口对象
	    thisMarker.openInfoWindow(infoWindow); //图片加载完后重绘infoWindow
	}
	
	// 百度地图API功能
	var map = new BMap.Map("allmap");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(121.4, 31.2), 12);  // 初始化地图,设置中心点坐标和地图级别
	map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
	map.addControl(new BMap.NavigationControl());    //添加控件：缩放地图的
	map.addControl(new BMap.ScaleControl());        //添加控件：地图显示比例的控件，默认在左下方；
    map.addControl(new BMap.OverviewMapControl());  //添加控件：地图的缩略图的控件，默认在右下方； TrafficControl    

	map.setCurrentCity("上海");          // 设置地图显示的城市 此项是必须设置的
	map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
	addMarker(points);

	//搜索
	 function load() {
        var scname = document.forms[0].scname.value;
 
        if (scname != null && scname.length > 0) {
            var local = new BMap.LocalSearch("上海市", {
                renderOptions : {
                    map : map,
                    panel : "results",
                    autoViewport : true,
                    selectFirstResult : false
                }
            });
 
            local.search(scname);
        }
    }
	
</script>

百度地图在java项目中的应用、搜索及定位点

猜你喜欢