Support » Plugin: Events Manager » Changing marker color on Google maps

  • Resolved Ninaj

    (@ninaj)


    I’m trying to change the marker color in Events Manager. I’ve tried to use this snippet with fillColor but I don’t think I know what I’m doing and it doesn’t work. Can anyone help?

    jQuery(document).bind(’em_maps_location_hook’, function( e, map, infowindow, marker ){
    ….
    });

Viewing 9 replies - 1 through 9 (of 9 total)
  • I am not part of support just some dude..
    I’m a little confused by the “fillColor” .

    Not to belittle your knowledge… and I am may be confused by what you want..

    The “markers” are images.. so to change the color, or the marker itself…
    Thusly create (or get) a new maker image that you like… and place it somewhere on your website… and then we will point to it in a script.
    Place in your Theme header.php file, preferable the child Theme
    and always make backups of your files…

    For a single location…

    <script type="text/javascript">
    jQuery(document).bind('em_maps_location_hook', function( e, map, infowindow, marker ){
    var myIcon = new google.maps.MarkerImage("http://yourwebsite/images/the-image.png", null, new google.maps.Point(0,0), new google.maps.Point(16,32), new google.maps.Size(40,48));
    //Apply marker to map
    marker.setOptions({'icon': myIcon });
    });
    </script>

    See if you can get that to work.. I tested it..
    For a map with a lot of locations for example with the shortcode `[locations_map]’

    It gets a little more complicated… see if the above works first.

    Plugin Support caimin_nwl

    (@caimin_nwl)

    Can you repost your code using the code button?

    I did.. it looks ok on my end…

    Thanks – I’ll try this. But it was actually on the multiple locations map I was needing to change the default red pin to a hex color. I could change it to a png if that’s easier. Will this also work on the em_maps_locations_hook?

    Please let us know if you get the above script to work..
    then we can move on..
    (no that exact code will not work for em_maps_locations_hook).

    But it’s similar…

    Thank you! That script worked for the single events! Now how do I do the overall event locations map?

    Wonderful.. there was much discussion on this in a number of posts..

    What has been working for me (from a number of posts here on this topic)…

    We need to change the core file events-manager.js
    the location is /includes/js

    So I also have to say that changing core files is not recommended.. as you will need to re-edit after the plugin ugrades.
    Make backup of file(s) you would change.

    In events-manager.js (from above)…
    About line 894
    Change jQuery(document).triggerHandler('em_maps_locations_hook', [maps[map_id], data, map_id]);

    to…
    jQuery(document).triggerHandler('em_maps_locations_hook', [maps[map_id], data, infowindow, maps_markers[map_id], map_id], marker_options[map_id]);

    And now the javascript, which we need to have the “markers” with an array.

    <script  type="text/javascript">
    jQuery(document).bind('em_maps_locations_hook', function(e,data,map,infowindow,markers){
    //Set marker image and size
    var myIcon = new google.maps.MarkerImage("http://yourwebsite/images/the-image.png", null, new google.maps.Point(0,0), new google.maps.Point(16,32), new google.maps.Size(40,48));
    //Apply marker to map using array
    for (var i = 0; i < markers.length; i++) {
    		markers[i].setOptions({icon: myIcon});
    	}
    
    });
    </script>

    And we put the javascript in the header.php file

    Hope that works for you.

    • This reply was modified 3 years, 5 months ago by Robswaimea.

    THANK YOU! That worked! You are awesome!

    Is there any possibility of being able to add the js changes into functions.php so it doesn’t get overwritten with updates?

    When I was investigating this last year I didn’t find any other approach.
    That doesn’t mean it can’t be done some way or another.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Changing marker color on Google maps’ is closed to new replies.