5 posts by 2 authors in: Forums > CMS Builder: Plugins & Add-ons
Last Post: July 25   (RSS)

Hi Orazio,

Yes, that should definitely be possible. If you're following my example from the other thread, the category that gets passed through can essentially be any value that matches up to the icon name. So you could do something like this instead:

<?php
foreach ($myBarRecords as $record) {
  if (!$record['latitude'] || !$record['longitude']) { continue; }
  $jsFunctionArgs = "{$record['latitude']}, {$record['longitude']}, {$record['num']}, '" .jsEncode($record['_link']). "', 'bar'";
  print "  _geocoder_addMarker($jsFunctionArgs);\n";
}
?>

This would then load these records using the icon filename "icon_category_bar.png", and the loop could be repeated for additional tables.

Let me know if you have any questions!

Thanks,

Daniel
PHP Programmer
interactivetools.com

hi dave thank you for your answer. 

Just a question

I have this code but how can i modify this part of code to set different icons for different table (restaurant and bar?)

  //
  function _geocoder_addMarker(latitude, longitude, recordNum, detailLink, category) {
    var latLng       = new google.maps.LatLng(latitude, longitude);
    var infowindowEl = document.getElementById('marker_infowindow_' + recordNum);
    var iconPath     = 'http://example.com/map/icon/';
    var marker       = new google.maps.Marker({ map: map, position: latLng, icon: iconPath + 'icon_category_' + 'bar' + '.png' });
    google.maps.event.addListener(marker, 'click', function() {
      if (infowindowEl) {
        infowindow.setContent(infowindowEl.innerHTML);
        infowindow.open(map, marker);
      }
      else {
        window.location = detailLink;
      }
    });
    bounds.extend(latLng);
  }

  //
  map.fitBounds(bounds);
}

Hi Orazio,

For the JavaScript portion of the code, you should not need to change that from my example in the previous thread. We use the PHP loop to pass in the different parameters, and we want "category" to be used to determine the different icon filenames. It should look like this:

  function _geocoder_addMarker(latitude, longitude, recordNum, detailLink, category) {
    var latLng       = new google.maps.LatLng(latitude, longitude);
    var infowindowEl = document.getElementById('marker_infowindow_' + recordNum);
    var iconPath     = 'http://example.com/path/to/icon/';
    var marker       = new google.maps.Marker({ map: map, position: latLng, icon: iconPath + 'icon_category_' + category + '.png' });
    google.maps.event.addListener(marker, 'click', function() {
      if (infowindowEl) {
        infowindow.setContent(infowindowEl.innerHTML);
        infowindow.open(map, marker);
      }
      else {
        window.location = detailLink;
      }
    });
    bounds.extend(latLng);
  }

You will set the different icon names using this line of the PHP loop I posted above:

$jsFunctionArgs = "{$record['latitude']}, {$record['longitude']}, {$record['num']}, '" .jsEncode($record['_link']). "', 'bar'";

The last portion of this line - 'bar' - gets passed into _geocoder_addMarker() as the "category" parameter. So each time you duplicate this loop for the different tables, you can simply change "bar" as needed and that new value will be used in the icon name. E.g. if you change it to "restaurant" then the icon filename used will be "icon_category_restaurant.png"

I hope that makes things more clear for you - let me know if you have any further questions!

Thanks,

Daniel
PHP Programmer
interactivetools.com

I forgot to add CATEGORY in this line

function _geocoder_addMarker(latitude, longitude, recordNum, detailLink, category)

Thank You daniel for your great support!

ORazio