Re: pre-sale GeoCoder plugin questions

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

By mbareara - July 22, 2019

In response to: https://www.interactivetools.com/forum/forum-posts.php?postNum=2242776#post2242776

Hi Daniel, 

and if i have results on map from two different tables (or more of course), for example Bar, Brewery, Restaurants, how could  i have different markers for each result?

Thank you in advance for your answer

Orazio 

By mbareara - July 24, 2019

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);
}

By daniel - July 25, 2019

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
Technical Lead
interactivetools.com

By mbareara - July 25, 2019

I forgot to add CATEGORY in this line

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

Thank You daniel for your great support!

ORazio