E
E
elena81kachanova2020-02-28 19:34:36
API
elena81kachanova, 2020-02-28 19:34:36

How to pass values ​​from input to Yandex map?

Good day.

There is a Yandex map with route planning.
There are two external input fields and a "Build route" button.
It is necessary that when the button is clicked, the values ​​from the inputs fall into the route and the route is built on the map.
When clicking, nothing happens, please tell me what could be wrong.

<script type="text/javascript">
 
        ymaps.ready(init);
 
        let myMap;
        let suggestViewFrom, suggestViewTo;
        let from, to;
 
        function init() {
 
            //Всплывающая подсказка
            suggestViewFrom = new ymaps.SuggestView('from');
            suggestViewTo = new ymaps.SuggestView('to');
 
            myMap = new ymaps.Map("map", {
                center: [55.755814, 37.617635],
                zoom: 8,
            });
 
            //Маршрут
            ymaps.route([from, to])
                .then(function (route) {
                    // Добавляем маршрут на карту.
                    myMap.geoObjects.add(route);
                },
                function (error) {
                    alert('Возникла ошибка: ' + error.message);
                });
        }
 
    </script>


<div id="app">
    <div><input type="text" id="from"></div>
    <div><input type="text" id="to"></div>
    <div><input type="submit" id="run" value="ПОСТРОИТЬ МАРШРУТ"></div>
    <div


<script type="text/javascript">
    document.getElementById('run').addEventListener('click', function () {
        from = document.getElementById('from').value;
        to = document.getElementById('to').value;
    });
 
</script>

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alexander Cheremkhin, 2020-02-28
@elena81kachanova

Call the route builder after
1) ymaps is ready (inside the init function)
2) in the button click handler "BUILD ROUTE"

ymaps.ready(init);
 
let myMap;
let suggestViewFrom, suggestViewTo;

 
function init() {
 
           myMap = new ymaps.Map("map", {
                center: [55.755814, 37.617635],
                zoom: 8,
            });

           //Всплывающая подсказка
             suggestViewFrom = new ymaps.SuggestView('from');
             suggestViewTo = new ymaps.SuggestView('to');
 
          document.getElementById('run').addEventListener('click', function () {
               const from = document.getElementById('from').value;
               const to = document.getElementById('to').value;
               
          
             //Маршрут
             ymaps.route([from, to])
                .then(function (route) {
                    // Добавляем маршрут на карту.
                    myMap.geoObjects.add(route);
                },
                function (error) {
                    alert('Возникла ошибка: ' + error.message);
               });
         });
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question