基于Leaflet查找路线起点与终点的最近自行车停靠点
需求:Leaflet路线规划网页 + 匹配最近自行车停靠点
我正在进行一个学校项目,需要创建一个使用Leaflet生成路线的网页。同时我有一份包含自行车停靠点的JSON文件,核心需求是:找到路线起点和终点各自对应的最近停靠点。
当前代码
<script> var map_var = L.map('map_id').setView([40.72730240765651, -73.9939667324035], 16); L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' }).addTo(map_var); var startPosition = L.latLng(); var endPosition = L.latLng(); L.Routing.control({ waypoints: [ startPosition, endPosition, ], routeWhileDragging: true, collapsible: true, geocoder: L.Control.Geocoder.nominatim() }).addTo(map_var); $.getJSON("citybike.json", function (json1) { for (var i = 0; i < json1.stationBeanList.length; i++) { var place = json1.stationBeanList[i]; coordinate = [place.latitude, place.longitude]; /*var marker = L.marker(coordinate); marker.addTo(map_var).bindPopup(`<b>${place.stAddress1}</b><br>Status: ${place.statusValue}<br>Bici disponibili: ${place.availableBikes}<br>Docks disponibili: ${place.availableDocks}`);*/ } }); </script>
JSON文件格式
{ "stationBeanList": [ { "id": 72, "stationName": "W 52 St & 11 Ave", "availableDocks": 32, "totalDocks": 39, "latitude": 40.76727216, "longitude": -73.99392888, "statusValue": "In Service", "statusKey": 1, "availableBikes": 6, "stAddress1": "W 52 St & 11 Ave", "stAddress2": "", "city": "", "postalCode": "", "location": "", "altitude": "", "testStation": false, "lastCommunicationTime": null, "landMark": "" } ] }
内容的提问来源于stack exchange,提问作者tommy
相关产品推荐
相关产品推荐

