如何在传单中以 GeoJSON 或折线中点的形式检索 mapquest 提供的所有可能的路径方向请回复

如何解决如何在传单中以 GeoJSON 或折线中点的形式检索 mapquest 提供的所有可能的路径方向请回复

我已经尝试了所有方法，但找不到任何解决方案。我使用了 mapquest 并且能够显示带有源和目的地之间所有可能路线的地图。请回复。

`#index.html

<!DOCTYPE html>
<html lang="en">
<head>
<Meta charset="UTF-8">
<Meta http-equiv="X-UA-Compatible" content="IE=edge">
<Meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Map Routes</title>
<link rel="stylesheet" 
href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.css">
<link rel="stylesheet" href="CSS/style.css">
<!--<link href="/favicon.ico" type="image/x-icon" rel="icon" />-->
<script src="./lib/leaflet-measure.css"></script>
<script src="./lib/leaflet-measure.js"></script>
</head>
<body style="border:0;margin:0">
<div id="map"></div>
<div class="formBlock">
<form id="form">
    <input type="text" name="start" class="input" id="start"  
placeholder="Choose starting point"/>
    <input type="text" name="end" class="input" id="destination"   
placeholder="Choose destination point"/><br><br>
<button type="submit"> Get Deractions</button>
</form>
</div>
<script 
src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/leaflet.js"> 
</script>
<script src="https://www.mapquestapi.com/sdk/leaflet/v2.2/mq-map.js? 
key=mapquest key"></script>
<script src="https://www.mapquestapi.com/sdk/leaflet/v2.2/mq-routing.js? 
key=mapquest key"></script>
<script src="app.js"></script>    
</body>
</html>
<script>
</script>

#app.js

let map = L.map('map',{
layers: MQ.mapLayer(),center: [35.791188,-78.636755],zoom: 12
});


function runDirection(start,end) {
  
  // recreating new map layer after removal
  map = L.map('map',{
      
      layers: MQ.mapLayer(),zoom: 12
  });
  
  var dir = MQ.routing.directions();

 

  dir.route({
    maxRoutes: 5,timeOverage: 25,locations: [
        
          start,end
      ]
  });


  CustomrouteLayer = MQ.Routing.RouteLayer.extend({
      createStartMarker: (location) => {
          var custom_icon;
          var marker;

          custom_icon = L.icon({
              iconUrl: 'img/red.png',iconSize: [40,35],iconAnchor: [20,29],popupAnchor: [0,-29]
          });

          marker = L.marker(location.latLng,{icon: 
custom_icon}).addTo(map);

          L.control.scale(
          ).addTo(map);
         
          


          return marker;
      },createEndMarker: (location) => {
          var custom_icon;
          var marker;

          custom_icon = L.icon({
              iconUrl: 'img/blue2.png',iconSize: [25,{icon: 
custom_icon}).addTo(map);

          return marker;
      }
  });
  
  map.addLayer(new CustomrouteLayer({
      directions: dir,fitBounds: true
  })); 
}


// function that runs when form submitted
function submitForm(event) {
event.preventDefault();

// delete current map layer
map.remove();

// getting form data
start = document.getElementById("start").value;
end = document.getElementById("destination").value;

// run directions function
runDirection(start,end);

// reset form



//document.getElementById("form").reset();



//leaflet measure

L.control.measure({
primaryLengthUnit: 'kilometers',secondaryLengthUnit: 'meter',primaryAreaUnit: undefined
}).addTo(map);


}

// asign the form to form variable
const form = document.getElementById('form');

// call the submitForm() function when submitting the form
form.addEventListener('submit',submitForm);`

现在我想要进入 GeoJson 点或折线形式的方向。如果有什么办法请回复

这是示例输出：

解决方法

最简单的方法是从路线请求中获取折线，而不是在放置后从地图中获取形状。 MapQuest.js L.mapquest.directions.route 函数具有可用于此目的的回调。

如何在传单中以 GeoJSON 或折线中点的形式检索 mapquest 提供的所有可能的路径方向请回复

如何解决如何在传单中以 GeoJSON 或折线中点的形式检索 mapquest 提供的所有可能的路径方向请回复

解决方法

相关推荐