使用传单路由机找到两个标记之间的路径

Ben*_*ine 5 javascript openstreetmap leaflet

我正在尝试使用传单在我的地图上的标记之间找到一条路线。我用了那个代码:

L.Routing.control({
waypoints: [
L.latLng(36.9009882, 10.3009531),
L.latLng(36.9922751, 10.1255164)
]}).addTo(map);
Run Code Online (Sandbox Code Playgroud)

但我的地图上没有新东西。有什么遗漏吗?我该怎么办?

Mah*_*gdy 0

1 - 您是否将(传单路由机)包含到您的应用程序中?\n2 - 确保您的地图变量是(地图)尝试这个简单的示例

\n

欲了解更多信息,请访问此页面\n https://www.liedman.net/leaflet-routing-machine/

\n

\r\n
\r\n
    var mymap = L.map(\'mapid\').setView([51.505, -0.09], 5);\n\n    L.tileLayer(\'https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw\', {\n        maxZoom: 18,\n        attribution: \'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, \' +\n            \'Imagery \xc2\xa9 <a href="https://www.mapbox.com/">Mapbox</a>\',\n        id: \'mapbox/streets-v11\',\n        tileSize: 512,\n        zoomOffset: -1\n    }).addTo(mymap);\n\n    L.marker([51.5, -0.09]).addTo(mymap)\n        .bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();\n\n    L.marker([53.5, -0.09]).addTo(mymap)\n        .bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();\n\n\n// route the way leafet machine as I said AI\n\n\nL.Routing.control({\n   waypoints:   [\n   L.latLng(51.5, -0.09),\n   L.latLng(53.5, -0.09)\n   ]\n}).addTo(mymap);
Run Code Online (Sandbox Code Playgroud)\r\n
<!DOCTYPE html>\n<html>\n<head>\n    \n    <title>Quick Start - Leaflet</title>\n\n    <meta charset="utf-8" />\n    <meta name="viewport" content="width=device-width, initial-scale=1.0">\n    \n    <link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />\n\n    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/>\n    <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>\n\n<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" />\n<link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine@latest/dist/leaflet-routing-machine.css" />\n<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>\n<script src="https://unpkg.com/leaflet-routing-machine@latest/dist/leaflet-routing-machine.js"></script>\n    \n</head>\n<body>\n\n\n\n<div id="mapid" style="width: 600px; height: 400px;"></div>\n<script>\n\n\n\n\n\n</script>\n\n\n\n</body>\n</html>
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n