百度地图API基本使用（三）

2023-12-17 21:25:36

事件

加载完成事件

当地图加载完成时，会触发加载完成事件。开发者可以通过监听该事件来执行后续操作，例如添加覆盖物、添加控件等。

// 创建地图实例
var map = new BMap.Map("container");

// 监听地图加载完成事件
map.addEventListener("load", function() {
  // 在地图加载完成后执行的代码
});

单击事件

当用户单击地图上的某个位置时，会触发单击事件。开发者可以通过监听该事件来获取单击位置的坐标，并执行相应的操作。

// 创建地图实例
var map = new BMap.Map("container");

// 监听地图单击事件
map.addEventListener("click", function(e) {
  // 获取单击位置的坐标
  var point = e.point;

  // 在单击位置处添加标记
  var marker = new BMap.Marker(point);
  map.addOverlay(marker);
});

注销事件

当不再需要监听某个事件时，可以注销该事件。这样可以节省资源，提高性能。

// 创建地图实例
var map = new BMap.Map("container");

// 监听地图单击事件
var listener = map.addEventListener("click", function(e) {
  // 获取单击位置的坐标
  var point = e.point;

  // 在单击位置处添加标记
  var marker = new BMap.Marker(point);
  map.addOverlay(marker);
});

// 注销单击事件监听器
map.removeEventListener("click", listener);

删除事件

当不再需要某个事件时，可以删除该事件。这样可以完全移除该事件，避免在后续操作中触发该事件。

// 创建地图实例
var map = new BMap.Map("container");

// 监听地图单击事件
var listener = map.addEventListener("click", function(e) {
  // 获取单击位置的坐标
  var point = e.point;

  // 在单击位置处添加标记
  var marker = new BMap.Marker(point);
  map.addOverlay(marker);
});

// 删除单击事件监听器
map.removeEventListener("click", listener, true);

路线规划

驾车路线规划

开发者可以使用百度地图API进行驾车路线规划。驾车路线规划可以提供从起点到终点的最优行驶路线，并显示行驶距离、行驶时间、路况信息等。

// 创建地图实例
var map = new BMap.Map("container");

// 创建驾车路线规划实例
var driving = new BMap.DrivingRoute("北京", "上海");

// 获取驾车路线规划结果
driving.search(function(result) {
  // 在地图上显示驾车路线
  map.addOverlay(result.getPolyline());
});

公交路线规划

开发者可以使用百度地图API进行公交路线规划。公交路线规划可以提供从起点到终点的最优公交路线，并显示乘坐公交车所需的时间、票价、换乘次数等。

// 创建地图实例
var map = new BMap.Map("container");

// 创建公交路线规划实例
var transit = new BMap.TransitRoute("北京", "上海");

// 获取公交路线规划结果
transit.search(function(result) {
  // 在地图上显示公交路线
  map.addOverlay(result.getPolyline());
});

骑行路线规划

开发者可以使用百度地图API进行骑行路线规划。骑行路线规划可以提供从起点到终点的最优骑行路线，并显示骑行距离、骑行时间、路况信息等。

// 创建地图实例
var map = new BMap.Map("container");

// 创建骑行路线规划实例
var biking = new BMap.RidingRoute("北京", "上海");

// 获取骑行路线规划结果
biking.search(function(result) {
  // 在地图上显示骑行路线
  map.addOverlay(result.getPolyline());
});

步行路线规划

开发者可以使用百度地图API进行步行路线规划。步行路线规划可以提供从起点到终点的最优步行路线，并显示步行距离、步行时间、路况信息等。

// 创建地图实例
var map = new BMap.Map("container");

// 创建步行路线规划实例
var walking = new BMap.WalkingRoute("北京", "上海");

// 获取步行路线规划结果
walking.search(function(result) {
  // 在地图上显示步行路线
  map.addOverlay(result.getPolyline());
});