Tentative d'attribution de couleurs pour les valeurs Null dans une carte D3, js v4

Question

Je crée une carte des comtés WI. Cela a l'air génial, sauf que l'un des comtés a une valeur "nulle" qui apparaît comme 0 sur la carte.

J'ai créé manuellement l'échelle de couleurs, mais je n'arrive pas à comprendre comment griser le comté avec la valeur nulle.

Des idées?

Voici le code que j'utilise pour définir la couleur

var color = d3.scaleThreshold() 
     .domain([0.16,0.31,0.47,0.58,0.94,1.15,1.41,2.02,3.36,6.47]) 
     .range(["#f7fcf0","#e0f3db", "#ccebc5", "#a8ddb5", "#7bccc4", 
     "#4eb3d3", "#2b8cbe", "#0868ac", "#084081", "#062953"]); 

J'ai essayé d'ajouter « null » dans le domaine et l'ajout d'une couleur correspondant à la plage, mais cela n'a rien donné.

Answer 1

Une façon simple de traiter des cas particuliers dans votre gamme de couleurs est de ne pas transmettre l'échelle directement à d3.attr/d3.style, mais l'envelopper dans une fonction anonyme et vérifiez là:

counties 
    .attr('fill', d => d === null ? 'grey' : color(d))