Создание списка маркеров Google Maps v3 из массива PHP

#php #arrays #google-maps

#php #массивы #google-карты

Вопрос:

У меня есть массив PHP в форме ниже, я пытаюсь отобразить их на карте Google (v3) на моем веб-сайте, но задался вопросом, как наилучшим образом создать код для маркеров. Ниже приведен пример некоторого рабочего кода, который я протестировал в жестком виде.

Я мог бы создать цикл, который создал список, однако мне пришлось бы проверить, чтобы удалить последнюю запятую, иначе Javascript был бы недействительным, и я чувствую, что это довольно хакерский и, вероятно, не лучший способ сделать это, я думал, вместо этого было бы что-то, что я упускаю из виду, что позволит мне передать массив и указать ему, какие ключи использовать для создания Javascript, все правильно отформатировано?

Пример массива

 Array ( 
[0] => Array ( 
[propertyId] => 1603 
[address1] => 1 Anystreet 
[address2] => 
[address3] => 
[town] => London: City 
[postcode] => AB1 3DE 
[sizeTotalSqM] => 906.18 
[sizeTotalSqF] => 9754.00 
[lat] => 51.5245029 
[lng] => -0.1120882 
[distance] => 0.00461191366463175 
[distanceMeters] => 0.512207377367013 
[description] => HTML description to go in here 
[imageUrl] => http://rackcdn.com/properties/o/1603-1.jpg 
[agentArray] => a:2:{i:0;a:6:{s:11:"agentUserId";s:2:"91";s:18:"agentUserFirstname";s:7:"Paul";s:16:"agentUserSurname";s:6:"Smith";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}i:1;a:6:{s:11:"agentUserId";s:3:"144";s:18:"agentUserFirstname";s:6:"Rupert";s:16:"agentUserSurname";s:7:"Perkins";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}} 
) 

[1] => Array ( 
[propertyId] => 505 
[address1] => 2 Anystreet 
[address2] => 
[address3] => 
[town] => London: City 
[postcode] => AB2 3CD 
[sizeTotalSqM] => 916.30 
[sizeTotalSqF] => 9863.00 
[lat] => 51.5189016 
[lng] => -0.1027654 
[distance] => 0.00908959843557461 
[distanceMeters] => 0.634894510451541 
[description] => Another description 
[imageUrl] => image-coming.png 
[agentArray] => a:3:{i:0;a:6:{s:11:"agentUserId";s:2:"91";s:18:"agentUserFirstname";s:7:"Paul";s:16:"agentUserSurname";s:6:"Smith";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}i:1;a:6:{s:11:"agentUserId";s:1:"5";s:18:"agentUserFirstname";s:5:"David";s:16:"agentUserSurname";s:7:"Beckham";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}i:2;a:6:{s:11:"agentUserId";s:2:"80";s:18:"agentUserFirstname";s:4:"Mark";s:16:"agentUserSurname";s:6:"Bourne";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}} 
) 

[2] => Array ( 
[propertyId] => 506 
[address1] => 45 Any Road
[address2] => Aldwych
[address3] => 
[town] => n/a 
[postcode] => AB3 2RF
[sizeTotalSqM] => 562.90 
[sizeTotalSqF] => 6059.00 
[lat] => 51.5189016 
[lng] => -0.1027654 
[distance] => 0.00908959843557461 
[distanceMeters] => 0.634894510451541 
[description] => Another description. 
[imageUrl] => http://rackcdn.com/properties/o/506-1.jpg 
[agentArray] => a:2:{i:0;a:6:{s:11:"agentUserId";s:1:"9";s:18:"agentUserFirstname";s:5:"Colin";s:16:"agentUserSurname";s:4:"Braddy";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}i:1;a:6:{s:11:"agentUserId";s:3:"107";s:18:"agentUserFirstname";s:7:"Richard";s:16:"agentUserSurname";s:6:"Head";s:18:"agentUserTelephone";s:20:"020 1 234 5678";s:9:"agentName";s:11:"The Agency";s:9:"agentLogo";s:15:"the-agency.png";}} 
) 
) 
  

Жестко закодированный Javascript-код для Google Maps — использует address1, lat и lng из массива. В будущем может потребоваться добавить больше

 var properties = [
        ['1 Anystreet', 51.5245029, -0.1120882],
        ['2 Anystreet', 51.5189016, -0.1027654],
        ['45 Any Road', 51.5189016, -0.1027654]
    ];
  

Комментарии:

1. Нет, я думаю, все в порядке. Я использую описанный вами подход (удаляя последнюю запятую)

Ответ №1:

Вы можете манипулировать своим массивом PHP, чтобы имитировать то, что требуется API Карт Google:

  Array ( 
     [0] => Array (
         [address1] => 1 Anystreet London
         [lat] => 51.5245029 
         [lng] => -0.1120882 
     )
     [1] => ...
 ) 
  

Чтобы сделать его доступным для чтения на JavaScript, просто повторите его в кодировке json:

 <script type="text/javascript">
    var locations = <?php echo json_encode($locations_array); ?>;
</script>
  

Это позволяет избежать необходимости экранирования любых символов, удаления завершающих запятых, вставки квадратных скобок и т.д.

Дополнительным преимуществом этого является сохранение ключа ваших данных, поэтому вы можете получить доступ к своим данным следующим образом, используя JavaScript:

 for(i in locations)
{
    var address1 = locations[i].address1;
    var lat = locations[i].lat;
    var lng = locations[i].lng;

    // use address1, lat, lng however you like
}
  

Комментарии:

1. Имеет смысл, однако, как мне манипулировать массивом PHP, то, от чего я действительно хочу избавиться в json_encode, это поле [description]. Однако я не хочу полностью уничтожать его, поскольку я буду использовать его в другом месте.

Ответ №2:

Я всегда использую следующее решение, и оно всегда работало. 😉

В представлении:

 <script type="text/javascript">

var properties = [
    <?php
    $count = count($data);
    for ( $i = 1; i <= count;   $i ) {
        $lat = str_replace(',', '.', $data['lat']);
        $lng = str_replace(',', '.', $data['lng']);
        echo '["' . $data['address1'] . '", ' . $lat . ',' . $lng . ']';

        if ( $i < $count ) {
            echo ',';
        }
    }
    ?>
];

</script>
  

Комментарии:

1. У вас возникнут проблемы, если ваш адрес когда-либо будет содержать апострофы, смотрите Мой ответ.

2. Используйте json_encode вместо этого, никогда не создавайте строку JSON вручную.

3. hsz, в ваших ) строках str_replace(',', '.', $data['lat'] отсутствует закрытие. Кроме того, вы не рассмотрели проблему апострофов ( ' ); каждый из них ' нуждается в экранировании обратной косой чертой, т.Е. ' но, как сказали я и lolwut, просто используйте json_encode , и все эти проблемы будут решены за вас

4. @Matt — спасибо за комментарий — я отредактировал свой ответ. Однако я использовал " вместо ' , поэтому ничего не нужно экранировать.

5. @hsz — Нет, " все равно потребуется экранирование: " .