Leaflet Routing Machine: 使用 L.Routing.control 绘制路线 - 详细指南

"如何使用Leaflet Routing Machine的L.Routing.control绘制路线"\n\n要使用Leaflet Routing Machine的L.Routing.control绘制路线，您需要完成以下步骤：\n\n1. 引入Leaflet和Leaflet Routing Machine库文件。您可以在页面中添加以下<script>标签来引入这两个库文件：\n\nhtml\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.js\"</script>\n<script src=\"https://cdnjs.cloudflare.com/ajax/libs/leaflet-routing-machine/3.3.4/leaflet-routing-machine.js\"</script>\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.7.1/leaflet.css\" />\n<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/leaflet-routing-machine/3.3.4/leaflet-routing-machine.css\" />\n\n\n2. 创建一个Leaflet地图实例并将其添加到页面中的某个元素中：\n\nhtml\n<div id=\"map\" style=\"height: 400px;\"></div>\n\n<script>\n var map = L.map('map').setView([51.505, -0.09], 13);\n L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {\n attribution: 'Map data &copy; <a href=\"https://www.openstreetmap.org/\">OpenStreetMap</a> contributors'\n }).addTo(map);\n</script>\n\n\n3. 创建一个L.Routing.control实例并将其添加到地图上：\n\nhtml\n<script>\n var control = L.Routing.control({\n waypoints: [\n L.latLng(51.5, -0.09),\n L.latLng(51.51, -0.1)\n ],\n routeWhileDragging: true\n }).addTo(map);\n</script>\n\n\n上述代码中的waypoints参数指定了路线的起点和终点坐标。您可以根据需要添加更多的途径点。routeWhileDragging参数设置为true表示在拖动途径点时实时绘制路线。\n\n通过以上步骤，您就可以使用Leaflet Routing Machine的L.Routing.control绘制路线了。您可以根据需要调整地图视图和路线的起点、终点和途径点坐标。