Set Marker Color based on center coo//rdinates.

2 posts, 0 answers
  1. Nathan
    Nathan avatar
    7 posts
    Member since:
    Jan 2017

    Posted 11 Jul Link to this post

    Hi guys I am trying to figure out how to set my center coordinates marker to a different color or a different image if that is easier. 

    Scenario:

    Based on the center coordinates we would like to place a marker on the map that identifies the center location. This marker should be identifiable by color. A good example of this would be the "You Are Here" on a map program like Around Me.  

    It would also be ideal if there were a way to tag specific markers and change their colors. Example all the red markers are restaurants, all the blue markers are pubs, etc.

    I have been working with the markerActivate function since from what I have read this is the opportunity to change marker color before rendering. However, I have not discovered a way to get a specific marker by name or coordinates. 

    i.e. if (e.marker.someidentifier == 'foo') {

    // change marker color code. 

    }

    Any help you could provide would be greatly appreciated. 

  2. Nathan
    Nathan avatar
    7 posts
    Member since:
    Jan 2017

    Posted 12 Jul in reply to Nathan Link to this post

    I resolved this issue here is my solution. Note the lat and long is hard coded for the example. 

    markerActivate: function (e) {
                        if (e.marker.dataItem.latlng[0] === 33.7465 && e.marker.dataItem.latlng[1] === -84.3915) {
                            e.marker.element[0].style
                                .backgroundImage =
                                    'url(http://kendo.cdn.telerik.com/2016.1.112/styles/Material/markers.png)';
                        }
                    }

Back to Top