标签：
<!DOCTYPE html>
<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=shmFW60npXiuwVtfXAUNS9AR"></script>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<title>文本标注</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
$(document).ready(function(){
$.getJSON("/cgi-bin/oalogin_read.cgi",function(result){
$.each(result, function(i, field){
if(typeof(field.address)=="undefined"){
return;
}
var point = new BMap.Point(field.point.x,field.point.y);
var opts = {
position : point, // 指定文本标注所在的地理位置
offset : new BMap.Size(30, -30) //设置文本偏移量
}
addr_array=field.address.split("|");
address=addr_array[1]+"-"+addr_array[2];
var label = new BMap.Label(address, opts); // 创建文本标注对象
label.setStyle({
color : "red",
fontSize : "12px",
height : "20px",
lineHeight : "20px",
fontFamily:"微软雅黑"
});
map.addOverlay(label);
var center_point = new BMap.Point(108.95309828,34.27779990);
map.centerAndZoom(center_point, 5);
// alert(field.address);
return;
});
});
});
</script> 效果图展示： 
<!DOCTYPE html>
<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 {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";}
#allmap{width:100%;height:500px;}
p{margin-left:5px; font-size:14px;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=shmFW60npXiuwVtfXAUNS9AR"></script>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<title>给多个点添加信息窗口</title>
</head>
<body>
<div id="allmap"></div>
<p>点击标注点，可查看由纯文本构成的简单型信息窗口</p>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
// 百度地图API功能
map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(108.95309828,34.27779990), 5);
var data_info = new Array();
$.getJSON("/cgi-bin/oalogin_read.cgi",function(result){
$.each(result, function(i, field){
if(typeof(field.address)=="undefined"){
return;
}
addr_array=field.address.split("|");
address=addr_array[1]+"-"+addr_array[2];
data_info.push([field.point.x,field.point.y,address])
});
var opts = {
width : 250, // 信息窗口宽度
height: 80, // 信息窗口高度
title : "信息窗口" , // 信息窗口标题
enableMessage:true//设置允许信息窗发送短息
};
for(var i=0;i<data_info.length;i++){
var marker = new BMap.Marker(new BMap.Point(data_info[i][0],data_info[i][1])); // 创建标注
var content = data_info[i][2];
map.addOverlay(marker); // 将标注添加到地图中
addClickHandler(content,marker);
}
function addClickHandler(content,marker){
marker.addEventListener("click",function(e){
openInfo(content,e)}
);
}
function openInfo(content,e){
var p = e.target;
var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
var infoWindow = new BMap.InfoWindow(content,opts); // 创建信息窗口对象
map.openInfoWindow(infoWindow,point); //开启信息窗口
}
});
});
</script> 效果图展示： 
服务器端，采用cgi方式，数据json格式数据放到apache的cgi目录：
/var/www/html/cgin-bin/oalogin_read.cgi
httpd.conf配置文件增加选项：AddHandler cgi-script .cgi
更改权限：
chown apache.apache oalogin_read.cgi
chmod u+x oalogin.read.cgi
#!/usr/bin/env python
# -*- coding: utf-8 -*-
import pickle
import urllib
import urllib2
import json
#
# 根据ip地址从百度地图api返回位置，地址等信息
def getInfoByIP(ip):
ak="shmFW60npXiuwVtfXAUNS9AR"
url="http://api.map.baidu.com/location/ip?ak="+ak+"&ip="+ip+"&coor=bd09ll"
#为urllib2 设置代理
proxy=urllib2.ProxyHandler({‘http‘: ‘http://10.10.61.4:3128‘})
opener= urllib2.build_opener(proxy)
urllib2.install_opener(opener)
req = urllib2.Request(url)
res_data = urllib2.urlopen(req)
res = res_data.read()
json_data = json.loads(res)
item={}
if json_data.has_key(‘address‘) and json_data.has_key(‘content‘):
# print json_data[‘address‘].encode(‘utf-8‘).decode(‘utf-8‘),json_data[‘content‘][‘point‘]
item[‘address‘]=json_data[‘address‘]
item[‘point‘]=json_data[‘content‘][‘point‘]
return item
输出json格式数据
def jsonResponse(result_json):
import cgi
import cgitb
cgitb.enable()
print "Content-type:application/json"
print
#cgi.print_environ()
print result_json
if __name__ == "__main__":
#从login.pk 文件中读取ip地址信息
login_db = open(‘/var/www/cgi-bin/login.pk‘,‘r‘)
login_data = pickle.load(login_db)
login_ips={}
for item in login_data:
# print item[0].decode(‘utf8‘),item[1:]
ip = item[-1].strip()
if login_ips.has_key(ip):
login_ips[ip]+=1
else:
login_ips[ip]=1
#print login_ips
#循环获取ip地址的详细信息
map_data_json=[]
for ip in login_ips.keys():
ip_data = getInfoByIP(ip)
map_data_json.append(ip_data)
encodejson=json.dumps(map_data_json)
jsonResponse(encodejson)
标签：
原文地址：http://my.oschina.net/zhailibao2010/blog/508187
