如何将字符串地址传递给传单路由设备以根据字符串地址获取方向? [英] How to pass string address to leaflet routing machine to get direction based on string address?

问题描述

好吧，我使用的是Leaflet api，然后我找到了一个很好的支持插件，称为Leaflet Routing Machine，用于以良好的路由显示从A到B的地址.

但是，传单路由机可以通过传递latlng正常工作，但不能通过传递地址，因此任何人都可以告诉它它如何工作，因为我知道以下链接中的属性信息:因此，路由路点具有名为name的属性，但不知道如何用它来提供地址a和地址B

这是一个显示新西兰奥克兰市的代码....并试图通过地址，但不起作用

 <脚本>var mymap = L.map('mapid'，{中心:[-36.85625，174.76141]，变焦:13});L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y} .png?access_token = pk.yourkey'，{来源:日志样本"，id:'mapbox.streets'}).addTo(mymap);//L.Control.geocoder().addTo(mymap);L.Routing.control({航点:[//L.latLng(-36.87178，174.753)，//L.latLng(-36.84514，174.76493)L.name(奥克兰12星晨广场")，L.name(奥克兰市罗斯基尔山道198号")]，routeWhileDragging:否}).addTo(mymap);</script> 

解决方案

据记得，您还可以将 L.Routing.Waypoint 对象传递给 waypoints ./p>

因此，您的代码如下所示:

 ....var geocoder = L.Control.Geocoder.nominatim()L.Routing.control({地理编码器:地理编码器，航点:[//L.latLng(-36.87178，174.753)，//L.latLng(-36.84514，174.76493)L.Routing.waypoint(null，奥克兰晨星广场12号")，L.Routing.waypoint(空，奥克兰自治市罗斯基尔山道198号")]，routeWhileDragging:否，}).addTo(mymap); 

但这又不会对它进行地理编码.而是仅填充航点文本框.您仍然需要在每个方框上都按回车键(或通过js触发它)以运行地址解析器.

另一种选择是从地理编码器中手动获取数据并在设置航点之前创建 L.Routing.Waypoint 或 L.LatLng 对象

  geocoder.geocode('蒙特利尔'，function(a，b){//根据地址解析器的结果可能在a或b中console.log(a);//在此处选择最佳结果.可能是数组中的第一个//创建航点对象var wpt = L.Routing.waypoint(L.latLng(lat，lng)，name)waypoints.push(wpt);})...//设置航点routingControl.setWaypoints(waypoints); 

更新以涵盖评论中的问题

带有弹出窗口的自定义标记可以通过 L.Routing.Plan 添加.您的 L.Routing.control 对象可以这样初始化:

  var geocoder = L.Control.Geocoder.nominatim()，waypoints = []，//稍后可以填充routeControl = L.Routing.control({计划:L.Routing.plan(waypoints，{createMarker:function(i，wp){返回L.marker(wp.latLng，{可拖动:true}).bindPopup(弹出的一些数据");}，地理编码器:地理编码器，routeWhileDragging:否，})}).addTo(map); 

Well, I am using leaflet api and then I found a very nice supporting plugin called leaflet routing machine for showing address from A to B with nice route.

However, leaflet routing machine working fine with passing of latlng but not working with passing address so can anyone tell how it can work as I know property information on following link: So routing waypoint have property called name but don;t know how to use it to provide address a and address B

Here is a code which shows new Zealand Auckland city....and trying to pass address but doesn't work

< script >

  var mymap = L.map('mapid', {
    center: [-36.85625, 174.76141],
    zoom: 13
  });

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.yourkey', {

  attribution: 'Log Sample',
  id: 'mapbox.streets'
}).addTo(mymap);
//L.Control.geocoder().addTo(mymap);
L.Routing.control({
  waypoints: [
    //L.latLng(-36.87178, 174.753),
    //L.latLng(-36.84514, 174.76493)
    L.name("12 Morning Star place, Auckland"),
    L.name("198 Dominion road, Mount Roskill, Auckland")
  ],
  routeWhileDragging: false
}).addTo(mymap); < /script>

解决方案

As far as remember you can pass L.Routing.Waypoint object to waypoints as well.

So, your code would look like:

....
var geocoder = L.Control.Geocoder.nominatim()

L.Routing.control({
  geocoder: geocoder,
  waypoints: [
    //L.latLng(-36.87178, 174.753),
    //L.latLng(-36.84514, 174.76493)
    L.Routing.waypoint(null,"12 Morning Star place, Auckland"),
    L.Routing.waypoint(null,"198 Dominion road, Mount Roskill, Auckland")
  ],
  routeWhileDragging: false,
}).addTo(mymap);

But this again doesn't geocode it. Instead just populates waypoints textboxes. You still need to hit enter (or trigger it by js) on each of the boxes to run geocoder.

Another option would be manually grabbing data from geocoder and create L.Routing.Waypoint or L.LatLng object before setting waypoints

geocoder.geocode('Montreal', function(a, b) {
    // depending on geocoder results may be either in a or b 
    console.log(a);
    // choose the best result here. probably the first one in array
    // create waypoint object
    var wpt = L.Routing.waypoint(L.latLng(lat, lng), name)
    waypoints.push(wpt);
})

...

// setting waypoints
routingControl.setWaypoints(waypoints);

Update to cover question in comments

The custom markers with popup could be added via L.Routing.Plan. Your L.Routing.control object could be initialized like so:

var geocoder = L.Control.Geocoder.nominatim(),
    waypoints = [], // can be populated later
    routeControl = L.Routing.control({
        plan: L.Routing.plan(waypoints, {
                createMarker: function(i, wp) {
                    return L.marker(wp.latLng, {
                        draggable: true
                    }).bindPopup("Some data for popup");
                },
            geocoder: geocoder,
            routeWhileDragging: false,
        })
    }).addTo(map);

这篇关于如何将字符串地址传递给传单路由设备以根据字符串地址获取方向?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！