@angelzzz

Как из php файла передать данные в переменную javascript?

Через API получаю данные от стороннего сервиса. Структура ответа:

[ { 
        ...     
        “Latitude”: “<Широта>”,
        “Longitude”:    “<Долгота>”,
        ...
} ]


С помощью php файла getdata.php прохожу по массиву и собираю все данные

foreach ($response as $item) {
    $a = "[".$item['Latitude'].",".$item['Longitude']."]," ;   
    $array = $array.$a ;
}

    $list= substr($array, 0, -1);
    echo json_encode($list);


Это список точек, который я хочу отобразить на карте с помощью Яндекс.Карты API.

var myMap = new ymaps.Map('map', {
...
    points = [
        [55.831903,37.411961], [55.763338,37.565466]
    ],
}


Использую вызов через ajax

function showData() { 
        var data="";
        $.ajax({ 
            url: "/GetList.php", 
            data: "", 
            dataType: 'json', 
            success: function(response) {
                var data = response; 
            } 
        }); 
        return data; 
    }
...
var myMap = new ymaps.Map('map', {
...
    points = [
        data
    ],
}


Понимаю, что код неверный, как правильно - не знаю.

1. Как мне передать данные переменной $list в points?
2. Не важный вопрос по корректности кода в php? Он вроде выводит верные данные, но нужно ли делать json_encode и можно ли заменить substr($array, 0, -1); на что-то внутри foreach?
  • Вопрос задан
  • 356 просмотров
Решения вопроса 2
Bellicus
@Bellicus
И швец, и жнец, и на дуде игрец.
Так строй карту сразу в блоке success ajax-запроса.

С яндексом не работал, но на примере гугла (из одного рабочего проекта). Данные получил, и тут же с ними и работаю.

$.ajax({
        url: "coords.json",
        dataType: "json",
        async: true,
        success: function(msg){
            google.maps.event.addDomListener(window, 'load', init);
            function init() {
                var mapOptions = {
                    zoom: 2,
                    center: new google.maps.LatLng(42, 10),
                    scrollwheel: false
                };
                var mapElement = document.getElementById('map');
                var map = new google.maps.Map(mapElement, mapOptions);
                setMarkers(map);
                map.addListener('click', function() {
                    if (infowindow) {
                        infowindow.close();
                    }
                });
            }

            function setMarkers(map) {
                for (var n = 0; n < msg.length; n++) {
                    console.group('Path: '+n);
                    for (var i = 0; i < msg[n].length; i++) {
                        var m = i+1;
                        var mrk = msg[n][i];
                        var next_mrk = msg[n][m];

                        var marker = new google.maps.Marker({
                            position: {lat: mrk[1], lng: mrk[2]},
                            map: map,
                            icon: image,
                            title: mrk[0],
                        });
                        Message(marker, mrk[3]);

                        if(next_mrk) {
                            var dashedLine = new google.maps.Polyline({
                                path: [
                                    {lat: mrk[1], lng: mrk[2]},
                                    {lat: next_mrk[1], lng: next_mrk[2]}
                                ],
                                strokeOpacity: 0,
                                icons: [{
                                    icon: line,
                                    offset: '0',
                                    repeat: '6px'
                                }],
                                map: map
                            });
                            console.dirxml(mrk[0]+" - "+next_mrk[0]);
                        } else {                            
                            console.dirxml(msg[n][i][0]);
                        }
                    }
                    console.groupEnd();
                }
            }

            function Message(marker, msg) {
                var infowindow = new google.maps.InfoWindow({
                    content: msg
                });
                marker.addListener('mouseover', function() {
                    this.setIcon(image_hover); this.setZIndex(2);
                    infowindow.open(marker.get('map'), marker);
                });
                marker.addListener('mouseout', function() {
                    this.setIcon(image); this.setZIndex(1);
                    infowindow.close();
                });
                marker.addListener('click', function() {
                    marker.get('map').setZoom(6);
                    marker.get('map').setCenter(marker.getPosition());
                });
            }
        }
    });
Ответ написан
@yociyavi
Или ajax-запросом или так
$phpVar = '{a: 1, b:2, c:3}';
echo "
<script>
var jsVar = $phpVar;
</script>
";
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@ArturArturov
или например в атрибут дата, наподобие:
<body  data-you-var-from-php='{"x": 1000, "y": 2000}'>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы