Mapbox 行车路线和 jQuery

Mapbox Driving Directions and jQuery

我正在使用 Mapbox 行车路线插件,在 rails 应用程序中进行我自己的地理编码,并使用 jQuery 设置 #mapbox-directions-origin-input 的值和#mapbox-directions-destination-input 表单输入地址或坐标。当我设置值时,没有任何反应。

$(document).ready(function(){

  $('#mapbox-directions-origin-input').val($('#current_coordinates').text());

  $('.leaflet-marker-icon').click(function(){
    if($('.leaflet-popup').length > 0){
      $('#mapbox-directions-destination-input').val($('.marker-description').text());
    }

  })

})

但是,当我复制并粘贴完全相同的值时,会出现说明。手动向表单输入添加 space 也有助于插件检索方向。

我假设我可以触发某种按键事件来模仿这种行为并让值正确传递,但我很难在代码中看到它。我主要是看这里,但很快就没了:https://github.com/mapbox/mapbox-directions.js/blob/121427f30e096e6e839652b8baa2d7ac6660fad3/src/input_control.js

有人有这方面的经验吗?

感谢您提供帮助@kmandov!

我可以通过围绕 jQuery 片段做一个结束 运行 来完成这项工作。

var directions = L.mapbox.directions();

var directionsLayer = L.mapbox.directions.layer(directions).addTo(map);

var directionsInputControl = L.mapbox.directions.inputControl('inputs', directions).addTo(map);

var directionsErrorsControl = L.mapbox.directions.errorsControl('errors', directions).addTo(map);

var directionsRoutesControl = L.mapbox.directions.routesControl('routes', directions).addTo(map);

var directionsInstructionsControl = L.mapbox.directions.instructionsControl('instructions', directions).addTo(map);

var destination = {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [<%= @direction.business.longitude %>, <%= @direction.business.latitude %>]
    },
    "properties": {
      "title": '<%= link_to @direction.business.name, business_url(@direction.business) %>',
      "description": '<%= @direction.business.full_street_address %>',
      "marker-color": "#3ca0d3",
      "marker-size": "large",
      "marker-symbol": "star"
    }
  };

  var origin = {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [<%= @current_location.longitude %>, <%= @current_location.latitude %>]
    },
    "properties": {
      "title": 'You',
      "description": '',
      "marker-color": "#ff0000",
      "marker-size": "large",
      "marker-symbol": "heart"
    }
  };

directions.setOrigin(origin).setDestination(destination).query();

也感谢 Mapbox 团队回复我的邮件!