Leaflet Routing Machine: 使用 L.Routing.control 绘制自定义路线

要使用Leaflet Routing Machine的L.Routing.control绘制自定义的路线，您需要按照以下步骤操作：\n\n1. 首先，确保您已经包含了Leaflet、Leaflet Routing Machine和相关的CSS和JS文件。您可以通过将以下代码添加到HTML文件的头部来包含它们：\n\nhtml\n<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet/dist/leaflet.css" />\n<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet-routing-machine/dist/leaflet-routing-machine.css" />\n\n<script src="https://cdn.jsdelivr.net/npm/leaflet/dist/leaflet.js"></script>\n<script src="https://cdn.jsdelivr.net/npm/leaflet-routing-machine/dist/leaflet-routing-machine.js"></script>\n\n\n2. 在HTML文件中创建一个用于显示地图的<div>元素：\n\nhtml\n<div id="map" style="height: 400px;"></div>\n\n\n3. 在JavaScript文件中，初始化地图并将其添加到上面创建的<div>元素中：\n\njavascript\nvar map = L.map('map').setView([51.505, -0.09], 13);\nL.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {\n attribution: '© OpenStreetMap contributors'\n}).addTo(map);\n\n\n4. 使用L.Routing.control创建路线控制器并将其添加到地图上：\n\njavascript\nL.Routing.control({\n waypoints: [\n L.latLng(51.5, -0.1), // 添加起始点\n L.latLng(51.505, -0.08), // 添加途经点\n L.latLng(51.51, -0.12) // 添加终点\n ],\n routeWhileDragging: true // 允许在拖拽时绘制路线\n}).addTo(map);\n\n\n在上面的代码中，waypoints数组用于指定路线上的点。您可以根据需要添加起始点、途经点和终点。\n\n5. 运行代码，您将在地图上看到绘制的路线。\n\n这就是使用Leaflet Routing Machine的L.Routing.control绘制自定义路线的基本步骤。您可以根据自己的需求修改和扩展这些代码。