0

Im have custom fields for lat/lon and querying them into google maps. The query im using works if I know the exact number of lat/lon.

    $args = array(
      'post_type'    => 'events',
      'orderby'      => 'meta_value',
      'meta_key'     => 'event_date',
      'meta_compare' => '>=',
      'tag_slug__and'  => $tag->name . ' ',
      'showposts'    => -1,
      'order'        => 'ASC'
      );
 $homePost = get_posts( $args );
  $date0 = $homePost[0];
    $lat0 = get_field( "gp_latitude",  $date0 ); 
    $lon0 = get_field( "gp_longitude", $date0 ); 
  $date1 = $homePost[1]; 
    $lat1 = get_field( "gp_latitude",  $date1 ); 
    $lon1 = get_field( "gp_longitude", $date1 ); 
  $date2 = $homePost[2];
    $lat2 = get_field( "gp_latitude",  $date2 ); 
    $lon2 = get_field( "gp_longitude", $date2 );
  $date3 = $homePost[3];
    $lat3 = get_field( "gp_latitude",  $date3 ); 
    $lon3 = get_field( "gp_longitude", $date3 );

 var locations = [

  [<?php echo json_encode($date3->post_title) ?>, <?php echo json_encode($lat3) ?>, <?php echo json_encode($lon3) ?>],
  [<?php echo json_encode($date2->post_title) ?>, <?php echo json_encode($lat2) ?>, <?php echo json_encode($lon2) ?>],
  [<?php echo json_encode($date1->post_title) ?>, <?php echo json_encode($lat1) ?>, <?php echo json_encode($lon1) ?>],
  [<?php echo json_encode($date0->post_title) ?>, <?php echo json_encode($lat0) ?>, <?php echo json_encode($lon0) ?>]
];

 var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 3,
  center: new google.maps.LatLng(37.4419, -122.1419),
  mapTypeId: google.maps.MapTypeId.ROADMAP

});
 var idleListener = google.maps.event.addListener(map, 'idle', function() { //important for full map shown 
  google.maps.event.trigger(map, 'resize');
   //google.maps.event.removeListener(idleListener);
});

var idleListener2 = google.maps.event.addListener(map, 'mousemove', function() {
  google.maps.event.trigger(map, 'resize');
  // google.maps.event.removeListener(idleListener2);
});


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));
}
google.maps.event.addListenerOnce(map, 'idle', function() {
   google.maps.event.trigger(map, 'resize');
   map.setCenter(latLng);
});

Is there a way to make this more dynamic?

  • You could loop over the array, to start. – s_ha_dum May 18 '15 at 18:47
  • What do you mean loop over the array? – Tsea May 18 '15 at 18:51
  • You are building you variables manually-- $date0 etc. Loop over $homePost instead. Lookup php's while' or foreach' – s_ha_dum May 18 '15 at 18:54
  • ohh ok let me try that – Tsea May 18 '15 at 18:59
  • Using a 'while' statement dosnt work for the map it only plots one point but i could see all the point in php – Tsea May 18 '15 at 20:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.