JavaScriptとTencent Mapsを利用して地図走行ナビゲーション機能を実装

var map = new TMap('mapContainer', {
  center: [39.9089, 116.3975],  // 地图中心点坐标
  zoom: 13  // 地图缩放级别
});

var startMarker = new TMap.Marker({
  position: [39.9039, 116.3916],  // 起点坐标
  icon: 'start_icon.png'  // 起点图标
});

var endMarker = new TMap.Marker({
  position: [39.9069, 116.4056],  // 终点坐标
  icon: 'end_icon.png'  // 终点图标
});

map.addOverlays([startMarker, endMarker]);  // 将标记添加到地图上

var drivingService = new TMap.DrivingService();

drivingService.search({
  startPoint: '39.9039,116.3916',  // 起点坐标
  endPoint: '39.9069,116.4056',  // 终点坐标
  mode: 'driving'  // 导航模式为驾车
}, function(result) {
  // 导航请求成功后执行的回调函数
  if (result.status === 0) {
    var route = result.routes[0];  // 获取第一条路线
    var steps = route.steps;  // 获取路线的所有步骤

    // 遍历所有步骤，获取每一步的起点和终点坐标
    for (var i = 0; i < steps.length; i++) {
      var step = steps[i];
      var startLocation = step.start_location;  // 步骤起点坐标
      var endLocation = step.end_location;  // 步骤终点坐标

      // 在地图上添加导航线路
      var polyline = new TMap.Polyline({
        path: [[startLocation.lat, startLocation.lng], [endLocation.lat, endLocation.lng]],  // 线路的起点和终点坐标
        strokeColor: '#00f',  // 线路颜色
        strokeWeight: 6  // 线路宽度
      });

      map.addOverlay(polyline);  // 将线路添加到地图上
    }
  }
});