2015-04-30 3 views
0

Я использую расширенные настраиваемые поля, чтобы установить местоположение сообщения и отобразить его на карте в пределах моего настраиваемого шаблона сообщения, и он отлично работает. Но я также создал карту google, которая отображает все местоположения моих пользовательских типов сообщений на одной карте.добавить больше информации в infowindow в google maps api

Моя проблема в том, что я не могу заставить ее вытащить контент или ссылку в инфоиндустрию из этих пользовательских сообщений. Я также не могу заставить его изменить маркер в зависимости от истинного/ложного поля.

Я осмотрел интернет и попытался использовать код, предлагаемый Google, а также пользователей на этом сайте, но я, кажется, что-то делаю неправильно. Все, что он делает, - это отображение названия, за которым следует странный символ. Любая помощь будет оценена :)

Это код, я использую:

<section> 

<?php 
    $args = array(
     'post_type'  => 'offices', 
     'posts_per_page' => -1 
); 
// query 
$wp_query = new WP_Query($args); 
$NUM = 0; 
?> 

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

<script src='http://maps.googleapis.com/maps/api/js?sensor=false' type='text/javascript'></script> 
<script type="text/javascript"> 
    var locations = [<?php while($wp_query->have_posts()){ 
    $wp_query->the_post(); 
    $location = get_field('location'); // IMPORTANT << Change this for your Google map field name !!!!!! 
?> 

['<?php the_title(); ?>', <?php echo $location['lat']; ?>, <?php echo $location['lng'];?>, <?php $NUM++ ?> ], 
    <?php } ?> ]; 

    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 7, /*Here you change zoom for your map*/ 
     center: new google.maps.LatLng(42.6, -76.0), /*Here you change center map first location*/ 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 

    var infowindow = new google.maps.InfoWindow(); 



    var marker, i; 

    for (i = 0; i < locations.length; i++) { 
     marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
     map: map 

     }); 

     google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
      infowindow.setContent(locations[i][0]); 
      infowindow.open(map, marker); 
     } 
     })(marker, i)); 
    } 

</script> 
</section> 

ответ

0

Да, у меня есть ваша проблема. По моему мнению, у вас все хорошо, но вам нужно немного изменить свой код.

Просто сделайте массив значений в ваше время цикла, как для маркеров:

$marker[] = '"'.get_the_title().'"'.','.$event_lat.','.$event_long; 

и для маркеров детали, как:

$marker_details[] = get_the_title().'_sunil_'.get_the_content($post->ID).'_sunil_'.$ev_location.'_sunil_'.get_permalink($post->ID); 

Тогда после этого просто поместите скрипт с помощью цикла Еогеаспа и взрывается выше $ marker_details array разделителем sunil.

Код будет:

var markers = [ 
     <?php foreach ($marker as $mar){ 
      echo "[".$mar."],"; 
     };?> 
     ]; 

var infoWindowContent = [ 
    <?php foreach ($marker_details as $mar_det){ 
     $check_val = explode('_sunil_',$mar_det);?> 
     ['<div class="info_content">' + 
     '<h3 style="display:block"><?php echo $check_val[0];?></h3><strong style="display:block;text-transform:capitalize;"><?php echo "Location : ".$check_val[2];?></strong>' + 
     '<p><?php echo substr($check_val[1], 0, 200);?>...</p><a href="<?php echo $check_val[3];?>" style="color:#18cecf;text-decoration:underline;font-weight:bold">Read More</a>' + '</div>'], 
     <?php }?> 
    ]; 

Не беспокоить структуру даже единичной запятой, делая его динамической с помощью петли. Просто возьмите свежие инструкции по использованию html и инструкции по выполнению отсюда: http://www.wptricks24.com/map-with-multiple-markers

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