转:http://blog.csdn.net/liusaint1992/article/details/50070839
百度地图API一:百度地图上循环显示标注点。使用闭包循环加载点击事件
本文记录:百度地图上循环显示标注点marker。使用立即执行函数和闭包循环加载点击事件显示信息窗口显示该标注点的更多信息。
1.准备数据。点的信息。
2.加载地图。中心点和显示级别默认中国。
3.循环显示标注点marker。使用立即执行函数和闭包循环加载点击事件显示信息窗口显示该标注点的更多信息。
4.点击显示标注点markers的信息窗口。
效果图:
第一篇结束。下一篇讲根据标注点的坐标范围载入地图时自适应地图显示级别和中心点。
百度地图API二:根据标注点坐标范围计算显示缩放级别zoom自适应显示地图
本文记录 如何通过标注点markers的坐标范围来计算百度地图的显示级别zoom。
- var points = [point1, point2,point3];
- var view = map.getViewport(eval(points));
- var mapZoom = view.zoom;
- var centerPoint = view.center;
- map.centerAndZoom(centerPoint,mapZoom);
代码:
addLine()代码:
随机生成新的轨迹点,动态添加到百度地图上。dynamicLine() 实际情况下这个函数应该是传参数。points。 这个points是一个数组。传参就可以直接添加新的轨迹到地图上。 绘制新的点并调节地图显示。
获取随机数:
移动地图中心点和显示级别:
初始效果图:
过几秒之后的效果图:
随机生成新的轨迹点,动态添加到百度地图上。dynamicLine() 实际情况下这个函数应该是传参数。points。 这个points是一个数组。传参就可以直接添加新的轨迹到地图上。 绘制新的点并调节地图显示。
初始效果图:
track_map = new BMap.Map("container");
window.map = track_map;
/*track_map.enableScrollWheelZoom();*/
/*track_map.centerAndZoom(points[0], 15);*/
/*map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.ScaleControl());
map.addControl(new BMap.OverviewMapControl({isOpen: true}));*/
//通过DrivingRoute获取一条路线的point
var driving = new BMap.DrivingRoute(track_map);
driving.search(points[0], points[points.length - 1]);
driving.setSearchCompleteCallback(function () {
//得到路线上的所有point
/*points = driving.getResults().getPlan(0).getRoute(0).getPath();*/
//画面移动到起点和终点的中间
/*centerPoint = new BMap.Point((points[0].lng + points[points.length - 1].lng) / 2, (points[0].lat + points[points.length - 1].lat) / 2);*/
/*track_map.panTo(points[0]);*/
//连接所有点
track_map.addOverlay(new BMap.Polyline(points, {
strokeColor: "#07f324",
strokeWeight: 3,
strokeOpacity: 1
}));
//显示小车子
/*label = new BMap.Label("", {offset: new BMap.Size(-20, -20)});
label.setContent("经度: " + points[0].lng + "<br>纬度: " + points[0].lat);*/
car = new BMap.Marker(points[0]);
/*car.setLabel(label);*/
track_map.addOverlay(car);
//显示起点终点
var icon = new BMap.Icon("/resources/images/startIcon.png", new BMap.Size(45, 45), {anchor: new BMap.Size(25, 45)});
var marker = new BMap.Marker(points[0], {icon: icon}); // 创建标注
track_map.addOverlay(marker);
var icon = new BMap.Icon("/resources/images/endIcon.png", new BMap.Size(45, 45), {anchor: new BMap.Size(25, 45)});
var marker = new BMap.Marker(points[points.length - 1], {icon: icon}); // 创建标注
track_map.addOverlay(marker);
//点亮操作按钮
playBtn.attr("disabled", false);
resetBtn.attr("disabled", false);
var view = track_map.getViewport(eval(points));
var mapZoom = view.zoom;
var centerPoint = view.center;
track_map.centerAndZoom(centerPoint,mapZoom);
function play() {
playBtn.attr("disabled", true);
pauseBtn.attr("disabled", false);
var point = points[index];
if (index > 0) {
track_map.addOverlay(new BMap.Polyline([points[index - 1], point], {
strokeColor: "red",
strokeWeight: 1,
strokeOpacity: 1
}));
}
/*label.setContent("经度: " + point.lng + "<br>纬度: " + point.lat);*/
car.setPosition(point);
index++;
if (followChk.prop('checked')) {
track_map.panTo(point);
}
if (index < points.length) {
timer = window.setTimeout("play(" + index + ")", 1000);
} else {
playBtn.attr("disabled", true);
pauseBtn.attr("disabled", true);
track_map.panTo(point);
}
}
function pause() {
playBtn.attr("disabled", false);
pauseBtn.attr("disabled", true);
if (timer) {
window.clearTimeout(timer);
}
}
function reset() {
followChk.attr("checked", false);
playBtn.attr("disabled", false);
pauseBtn.attr("disabled", true);
if (timer) {
window.clearTimeout(timer);
}
index = 0;
car.setPosition(points[0]);
/*label.setContent("经度: " + points[0].lng + "<br>纬度: " + points[0].lat);*/
/*track_map.panTo(points[0]);*/
var view = track_map.getViewport(eval(points));
var mapZoom = view.zoom;
var centerPoint = view.center;
track_map.centerAndZoom(centerPoint,mapZoom);
}
百度地图API五:百度地图坐标转换
/**
* 高德转百度
* @param gd_lon
* @param gd_lat
* @return
*/
public static double[] gaoDeToBaidu(double gd_lon, double gd_lat) {
double[] bd_lat_lon = new double[2];
double PI = 3.14159265358979324 * 3000.0 / 180.0;
double x = gd_lon, y = gd_lat;
double z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * PI);
double theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * PI);
bd_lat_lon[0] = z * Math.cos(theta) + 0.0065;
bd_lat_lon[1] = z * Math.sin(theta) + 0.006;
return bd_lat_lon;
}
/**
* 百度转高德
* @param bd_lat
* @param bd_lon
* @return
*/
public static double[] bdToGaoDe(double bd_lat, double bd_lon) {
double[] gd_lat_lon = new double[2];
double PI = 3.14159265358979324 * 3000.0 / 180.0;
double x = bd_lon - 0.0065, y = bd_lat - 0.006;
double z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * PI);
double theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * PI);
gd_lat_lon[0] = z * Math.cos(theta);
gd_lat_lon[1] = z * Math.sin(theta);
return gd_lat_lon;
}