传单路由机的行驶时间和距离答案

【问题标题】：Drive Time and Distance from Leaflet Routing Machine传单路由机的行驶时间和距离
【发布时间】：2015-10-22 18:10:36
【问题描述】：

我正在使用 JQuery 数据表、带有 OSM 磁贴的 Leaflet 和 Leaflet Routing Machine 为 CRM 构建嵌入式内容。地图上的标记和表格的行基于相同的 JSON 数据，我正在两个库之间构建交互（使用 SHARED JavaScript 函数）。例如，当单击 Datatable 行时，该行将突出显示，在相应的地图标记上打开一个弹出窗口，并使用 LRM 计算路线，将路线线放置在地图上。相反，当点击地图标记时，所有相同的事件都会发生，因为我正在调用 SAME 函数。

默认情况下，LRM 创建的行程是隐藏在地图上的，但我想解析出行驶时间和距离，并将它们插入共享功能打开的弹出窗口中。我花了四天时间翻阅 API 文档并搜索互联网，寻找有关如何从 Itinerary 对象访问这些值的明确说明或代码示例，但没有成功。我检查了每个对象，我可以弄清楚如何登录到控制台，但我需要的数据是在我尝试访问它们时出现“未定义”的属性中。

请问，从头到尾，我如何访问行程摘要？

当我初始化地图时，我还用空航点初始化路由控制：

ctrl = L.Routing.control({ 
            waypoints: null, 
            units: 'imperial', 
            show: false, 
            createMarker: function() { return null; }
        }).addTo(map);

当一个标记/行被点击时，我调用这个函数：

function clickEffects(id, latlon) {

// set waypoints for routing control
ctrl.setWaypoints([ ctr, latlon])    

// scroll the table to the row for the clicked marker
table.$('tr.selected').removeClass('selected');         
var idx = table.row("#" + id).index()
table.row(idx).show().draw(false);
table.row(idx).nodes().to$().addClass('selected');


// create and open a popup
var popup = L.popup()
    .setLatLng(latlon)
    .setContent("Dan was here!!!")
    .openOn(map);
}

【问题讨论】：

标签： maps leaflet

【解决方案1】：

想通了：

在全局范围内声明弹出窗口
创建标记时绑定默认的“正在加载...”内容
在共享功能中，在新的弹出内容中设置 div 和目标 id （除了新检索的 ajax 内容。
在“routesfound”事件监听器中，使用 JQuery 插入格式化的在目标 div 上行驶时间和距离。

像魅力一样工作。现在只需要扩展 ajax 数据...

【讨论】：