vs2010MFC调用百度地图

来源：互联网发布：学英标的软件编辑：程序博客网时间：2024/06/05 15:56

vs2010中添加web browsers 控件，为控件增加成员变量，在初始化的程序中调用以下代码加载百度地图。

CRect rect;
GetWindowRect(&rect);
ScreenToClient(&rect);
m_map.SetWindowPos(NULL,0,0,rect.Width(),rect.Height(),SWP_NOZORDER|SWP_NOMOVE);
m_map.Navigate("D:\\work src\\EnterMapDlg\\EnterMapDlg\\res\\map.htm",NULL,NULL,NULL,NULL);

其中D:\\work src\\EnterMapDlg\\EnterMapDlg\\res\\map.htm为js写好的，可以在vs2010资源中添加htm资源，然后将下面的源码（贴上自己的秘钥之后）粘贴进去，注意百度地图API编程需要注册秘钥，具体的注册方法在网上随便搜一下就有了。基本实现覆盖物，缩放拖拽，动态覆盖物，覆盖物标签，单击定位等功能，更多功能请参考百度官方平台http://lbsyun.baidu.com/index.php?title=jspopular

代码如下：

<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=LMZxTGwRmvH7TOUEi6G6RNl03etZQMyZ"></script>
<title>为多个点注册单击事件</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(113.99206, 22.59157);
map.centerAndZoom(point, 15);
map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.OverviewMapControl());
map.addControl(new BMap.ScaleControl());
map.enableScrollWheelZoom();
map.addControl(new BMap.MapTypeControl());

var top_left_navigation = new BMap.NavigationControl(); //左上角，添加默认缩放平移控件

var json_data = [[113.99206, 22.59195], [113.99126, 22.59220], [113.99150, 22.59200]];
var pointArray = new Array();
for (var i = 0; i < json_data.length; i++) {
/* var marker = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1])); // 创建点
map.addOverlay(marker); //增加点
pointArray[i] = new BMap.Point(json_data[i][0], json_data[i][1]);
marker.addEventListener("click", attribute);*/
if (i == 1) {
var myIcon = new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png", new BMap.Size(23, 25), {
offset: new BMap.Size(10, 25),
imageOffset: new BMap.Size(1, 0 - 1 * 25)
});
var marker = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1]), { icon: myIcon });
marker.setAnimation(BMAP_ANIMATION_BOUNCE);
var label = new BMap.Label("编号:10001!，在线", { offset: new BMap.Size(20, -10) });
marker.setLabel(label);
}
else {
var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {
offset: new BMap.Size(10, 25),
imageOffset: new BMap.Size(1, 0 - 10 * 25)
});
var marker = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1]), { icon: myIcon });

var label = new BMap.Label("编号:1000" + i + "已下线", { offset: new BMap.Size(20, -10) });
marker.setLabel(label);
}

map.addOverlay(marker)
pointArray[i] = new BMap.Point(json_data[i][0], json_data[i][1]);
marker.addEventListener("click", attribute);

/* var icons = "D:\\work src\\S010G_SoftwarePlat\\S010G_SoftwarePlat\\res\\main.bmp"; //这个是你要显示坐标的图片的相对路径
var markers = new BMap.Marker(new BMap.Point(json_data[i][0], json_data[i][1])); //lng为经度,lat为纬度
var icon = new BMap.Icon(icons, new BMap.Size(25, 25)); //显示图标大小
markers.setIcon(icon); //设置标签的图标为自定义图标
map.addOverlay(markers); //将标签添加到地图中去*/
}
//让所有点在视野范围内
map.setViewport(pointArray);
//获取覆盖物位置
function attribute(e) {
var p = e.target;
alert("设备位置：" + p.getPosition().lng + "," + p.getPosition().lat);
}
</script>

0 0