2

I'm having some trouble setting different markers using the smart map plugin and was hoping someone might be able to point me in a direction I might not see.

The different locations are are set through a matrix field with two different block types; one that should return a blue marker and one that should return a green. I've been following the docs at: https://plugins.doublesecretagency.com/smart-map/different-icons-for-different-marker-types/ but have still been getting a javascript error preventing it to be rendered.

The javascript error is "uncaught TypeError: Cannot read property 'setOptions' of undefined. I'm sure this is because the markerId variable isn't getting the address from the matrix field.

Any help or insight would be greatly appreciated, thanks!

 {% set locations = entry.filmMap %}
{% set mapOptions = {
    height: 580,
    zoom: 10,
    draggable: true,
    markerInfo: '_includes/mapInfoBubble',
    markerOptions: {
    icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png'
  }
} %}

{{ craft.smartMap.map(locations, mapOptions) }}

{# Loop through location entries #}
{% for item in locations %}

  {% switch item.type %}
    {% case 'filmSites' %}
      {% set icon = '/assets/src/images/blue-marker.png' %}
    {% case 'castingCalls' %}
      {% set icon = '/assets/src/images/green-marker.png' %}
    {% default %}
      {% set icon = 'http://maps.google.com/mapfiles/ms/icons/green-dot.png' %}
  {% endswitch %}

  {% set address = item.address %}

  {# JS: Change marker icon #}
  {% includejs %}

    var markerId = 'smartmap-mapcanvas-1.{{ entry.id }}.address';
    smartMap.marker[markerId].setOptions({'icon': '{{ icon }}'});

  {% endincludejs %}

{% endfor %}
1
  • I'm impressed... I only added that page to the documentation 2 days ago. ;)
    – Lindsey D
    Commented Jan 4, 2016 at 21:05

1 Answer 1

2

I believe the problem is in this line of code:

var markerId = 'smartmap-mapcanvas-1.{{ entry.id }}.address';

Because you're generating markers from matrix blocks, you'll need to use the block ID instead of the entry ID. In your case, that may looks something like this:

var markerId = 'smartmap-mapcanvas-1.{{ item.id }}.address';
1
  • This was indeed the source of my problem, thank you very much!
    – BryanB
    Commented Jan 4, 2016 at 21:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.