2014-12-12 1 views
0

Я создаю приложение рельсов для платформы бронирования такси, которая требует ввода точки срабатывания и точки падения. Я включил следующий сценарий в моем application.html.erb для этой цели в пределах тегов заголовков:Как решить эту проблему в Autocomplete Google Maps в моем приложении Rails?

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&libraries=places"></script> 
<script type="text/javascript"> 
    var placeSearch,autocomplete; 
    function initialize() { 
    autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'), { types: [ 'geocode' ] }); 
    google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     fillInAddress(); 
    }); 

    autocomplete2 = new google.maps.places.Autocomplete(document.getElementById('autocomplete2'), { types: [ 'geocode' ] }); 
    google.maps.event.addListener(autocomplete2, 'place_changed', function() { 
     fillInAddress(); 
}); 
    } 
    function fillInAddress() { 
    var place = autocomplete.getPlace(); 

    for (var component in component_form) { 
     document.getElementById(component).value = ""; 
     document.getElementById(component).disabled = false; 
    } 

    for (var j = 0; j < place.address_components.length; j++) { 
     var att = place.address_components[j].types[0]; 
     if (component_form[att]) { 
     var val = place.address_components[j][component_form[att]]; 
     document.getElementById(att).value = val; 
     } 
    } 
    } 
</script> 

Я затем использовал этот Js следующим образом в моем теге:

<div class="field"> 
    <%= label_tag ("Pickup Location: ") %><br> 
    <%= text_field_tag :pickup_loc, nil, :id => "autocomplete", :placeholder => "Enter your pickup location" %> 
    </div> 
    <div class="field"> 
    <%= label_tag ("Drop Location: ") %><br> 
    <%= text_field_tag :drop_loc, nil, :id => "autocomplete2", :placeholder => "Enter your dropoff location" %> 
    </div> 

While автозаполнения функция, похоже, работает, результат функции автозаполнения, по-видимому, является подмножеством результатов, которые дают карты google. Для бывших, когда я ставлю «азиатскую GPR ...» в качестве поискового запроса в моем приложении, он не показывает азиатский GPR Multiplex, как вариант:

enter image description here

Однако, когда я использую тот же строка запроса в Картах Google, я получаю желаемый результат:

enter image description here

Я пытался найти много об этом, но не смог найти решение. Где я иду не так?

ответ

1

Если вы читали the documentation here он говорит:

массив типов указывает явный тип или коллекцию типа, как , перечисленных в поддерживаемых типов ниже. Если ничего не указано, возвращаются все типы . В общем случае допускается только один тип. Исключение заключается в том, что вы можете безопасно смешивать геокодирование и создание типов , но учтите, что это будет иметь такой же эффект, как и указание типов .

Так что я думаю, вам нужно только удалить параметр типа следующим образом:

function initialize() { 
    autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete')); 
    google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     fillInAddress(); 
    }); 

    autocomplete2 = new google.maps.places.Autocomplete(document.getElementById('autocomplete2')); 
    google.maps.event.addListener(autocomplete2, 'place_changed', function() { 
     fillInAddress(); 
}); 

или вы можете добавить тип учреждения:

function initialize() { 
    autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'), { types: [ 'geocode', 'establishment' ] }); 
    google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     fillInAddress(); 
    }); 

    autocomplete2 = new google.maps.places.Autocomplete(document.getElementById('autocomplete2'), { types: [ 'geocode', 'establishment' ] }); 
    google.maps.event.addListener(autocomplete2, 'place_changed', function() { 
     fillInAddress(); 
}); 
+0

Благодаря Badoo ... он работает, но как рассчитать расстояние между моим происхождением и местами назначения? Раньше я использовал GoogleDirections.new (params [: pickup_loc], params [: drop_loc]). Distance_in_miles, но после удаления опции типа все мои расстояния показывают 0. Нужно ли мне также обновлять формулу расстояния? Как? –

+0

Ну, это еще один вопрос. Лучше всего было бы добавить [метод computeDistanceBetween, предоставляемый google api] (https://developers.google.com/maps/documentation/javascript/reference#spherical). Это собирается рассчитать прямую линию между двумя широтами и долготы: 'google.maps.geometry.spherical.computeDistanceBetween ( a, b );' или вы можете проверить [службу матрицы расстояния] (https://developers.google.com/maps/documentation/javascript/distancematrix), но это скорее калькулятор расстояния путешествия. – bTazi

Смежные вопросы