Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.05.2014, 17:53
Аспирант
Отправить личное сообщение для Dark19 Посмотреть профиль Найти все сообщения от Dark19
 
Регистрация: 29.04.2014
Сообщений: 82

Передача значения переменной в php c Ymaps
Здравствуйте, подскажите как мне передать переменные distance и address в php код с js кода(Ymaps api) без перезагрузки страницы?
Когда передаю вот так:
$.ajax({
                                    url: "http://geo/index.php",
                                    type : "GET",
                                    data : ({distance:distance}),
                                    success: function (responseText) {
                                        alert(responseText);
                                    }


то карта не загружается

Вот код Ymaps:
<!-- Если вы используете API локально, то в URL ресурса необходимо указывать протокол в стандартном виде (http://...)-->
    <script src="//api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
    <style>
        html, body, #map {
            width: 100%;
            height: 100%;
            padding: 0;
            margin: 0;
        }
    </style>

    <script type="text/javascript">
        function init() {
            var myMap = new ymaps.Map('map', {
                    center: [50.340512, 30.534661],
                    zoom: 10,
                    type: 'yandex#map',
                    behaviors: ['scrollZoom', 'drag'],
                    controls: []
                }),
                searchStartPoint = new ymaps.control.SearchControl({
                    options: {
                        useMapBounds: true,
                        noPlacemark: true,
                        noPopup: true,
                        placeholderContent: 'Адрес начальной точки',
                        size: 'large'
                    }
                }),
                searchFinishPoint = new ymaps.control.SearchControl({
                    options: {
                        useMapBounds: true,
                        noCentering: true,
                        noPopup: true,
                        noPlacemark: true,
                        placeholderContent: 'Адрес конечной точки',
                        size: 'large',
                        float: 'none',
                        position: { left: 10, top: 44 }
                    }
                }),
                calculator = new DeliveryCalculator(myMap, myMap.getCenter());

            myMap.controls.add(searchStartPoint);
            myMap.controls.add(searchFinishPoint);

            searchStartPoint.events.add('resultselect', function (e) {
                var results = searchStartPoint.getResultsArray(),
                    selected = e.get('index'),
                    point = results[selected].geometry.getCoordinates();

                calculator.setStartPoint(point);
            })
                .add('load', function (event) {
                    // По полю skip определяем, что это не дозагрузка данных.
                    // По getRusultsCount определяем, что есть хотя бы 1 результат.
                    if (!event.get('skip') && searchStartPoint.getResultsCount()) {
                        searchStartPoint.showResult(0);
                    }
                });

            searchFinishPoint.events.add('resultselect', function (e) {
                var results = searchFinishPoint.getResultsArray(),
                    selected = e.get('index'),
                    point = results[selected].geometry.getCoordinates();

                calculator.setFinishPoint(point);
            })
                .add('load', function (event) {
                    // По полю skip определяем, что это не дозагрузка данных.
                    // По getRusultsCount определяем, что есть хотя бы 1 результат.
                    if (!event.get('skip') && searchFinishPoint.getResultsCount()) {
                        searchFinishPoint.showResult(0);
                    }
                });
        }

        function DeliveryCalculator(map, finish) {
            this._map = map;
            this._start = null;
            this._route = null;

            map.events.add('click', this._onClick, this);
        }

        var ptp = DeliveryCalculator.prototype;

        ptp._onClick= function (e) {
            if (this._start) {
                this.setFinishPoint(e.get('coords'));
            } else {
                this.setStartPoint(e.get('coords'));
            }
        };

        ptp._onDragEnd = function (e) {
            this.getDirection();
        }

        ptp.getDirection = function () {
            if(this._route) {
                this._map.geoObjects.remove(this._route);
            }

            if (this._start && this._finish) {
                var self = this,
                    start = this._start.geometry.getCoordinates(),
                    finish = this._finish.geometry.getCoordinates();

                ymaps.geocode(start, { results: 1 })
                    .then(function (geocode) {
                        var address = geocode.geoObjects.get(0) &&
                            geocode.geoObjects.get(0).properties.get('balloonContentBody') || '';

                        ymaps.route([start, finish])
                            .then(function (router) {
                                var distance = Math.round(router.getLength() / 1000),
                                    message = '<span>Расстояние: ' + distance + 'км.</span><br/>' +
                                        '<span style="font-weight: bold; font-style: italic">Стоимость доставки: %sр.</span>';

                                self._route = router.getPaths();

                                self._route.options.set({ strokeWidth: 5, strokeColor: '0000ffff', opacity: .5 });
                                self._map.geoObjects.add(self._route);
                                self._start.properties.set('balloonContentBody', address + message.replace('%s', self.calculate(distance)));

                            });
                    });
                self._map.setBounds(self._map.geoObjects.getBounds())
            }
        };

        ptp.setStartPoint = function (position) {
            if(this._start) {
                this._start.geometry.setCoordinates(position);
            }
            else {
                this._start = new ymaps.Placemark(position, { iconContent: 'А' }, { draggable: true });
                this._start.events.add('dragend', this._onDragEnd, this);
                this._map.geoObjects.add(this._start);
            }
            if (this._finish) {
                this.getDirection();
            }
        };

        ptp.setFinishPoint = function (position) {
            if(this._finish) {
                this._finish.geometry.setCoordinates(position);
            }
            else {
                this._finish = new ymaps.Placemark(position, { iconContent: 'Б' }, { draggable: true });
                this._finish.events.add('dragend', this._onDragEnd, this);
                this._map.geoObjects.add(this._finish);
            }
            if (this._start) {
                this.getDirection();
            }
        };

        ptp.calculate = function (len) {
            // Константы.
            var DELIVERY_TARIF = 20,
                MINIMUM_COST =  500;

            return Math.max(len * DELIVERY_TARIF, MINIMUM_COST);
        };

        ymaps.ready(init);


    </script>

<div id="map"></div>

Последний раз редактировалось Dark19, 14.05.2014 в 17:56.
Ответить с цитированием
  #2 (permalink)  
Старый 26.05.2014, 14:50
Интересующийся
Отправить личное сообщение для SindBad Посмотреть профиль Найти все сообщения от SindBad
 
Регистрация: 15.03.2011
Сообщений: 11

Dark19,
не загружается, потому что distance внутри $.ajax не определена, и скрипт падает с ошибкой. Нужно расположить код карты и вызов fjax в одной области видимости и в самом начале определить var distance.
Затем внутри кода карты var нужно убрать - таким образом задается использованеие уже существующей переменной.
Делается это примерно так:

(function($, ymaps){
 var distance;
 function init() {...........

 ....и остальной код карты......}
 $.ajax({
                                    url: "http://geo/index.php",
                                    type : "GET",
                                    data : {distance:distance},
                                    success: function (responseText) {
                                        alert(responseText);
                                    }

})(jQuery, ymaps);


Имейте в виду, если есть другие переменные вне данного скрипта, которые использует код карты, их тоже надо передать как jQuery и ymaps.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
получение id строки и передача значения переменной php msscriin jQuery 17 27.10.2013 11:52
Передача переменной из JS в PHP и обратно Gregorian Общие вопросы Javascript 5 11.09.2012 16:12
передача из php в javascript многострочной переменной smollvrn Общие вопросы Javascript 12 14.11.2010 20:38
передача переменной из jQuery в PHP UpJump jQuery 3 03.11.2010 12:14
Передача переменной из JS в PHP методом ajax skalka jQuery 7 28.08.2010 12:05