javascriptjqueryd3.jstopojsondatamaps

Datamaps: How to set conditional highlight fill colors for objects with data


In the event that a country object has data in location_data I want one to set highlightFillColor to green, if not the object would either highlight in gray or disable the highlight altogether on hover. Here is what I'm currently using (to no effect): fiddle

highlightFillColor: function(data) {
  if (data) {
    return 'green';
  }
  return '#dbdbdb';
},

Solution

  • Since you already created a property named fillKey for those countries with data, you can simply do:

    highlightFillColor: function(data) {
        if (data.fillKey) {
            return 'green';
        }
        return '#dbdbdb';
    }
    

    Here is your updated fiddle: https://jsfiddle.net/cvrsjj9f/