ordinal.unknown（[value]）<>

Question

如果域中不存在某项，是否可以将scaleOrdinal设置为返回默认颜色？

例如：

var type = d3.scaleOrdinal()
        .domain(['WeWork', 'Regus', 'Spaces', 'Knotel', 'RocketSpace', 'HQ Global Workspaces'])
        .range(['red', 'blue', 'green', 'purple', 'yellow', 'orange', 'pink']);

对于不是该领域6家公司之一的所有公司，我希望它们的颜色为灰色。没有一堆额外的代码，有没有一种简便的方法？谢谢！

Answer 1

使用scaleOrdinal.unknown：

var type = d3.scaleOrdinal()
        .domain(['WeWork', 'Regus',...])
        .range(['red', 'blue',...])
        .unknown("grey");

这会为未知输入分配一个值：

ordinal.unknown（[value]）<>

如果指定了值，则设置未知的标尺的输出值   输入值并返回此比例。如果未指定值，   返回当前未知值，默认为隐式。的   隐式值启用隐式域构造；看到   顺序域。（from the docs）

这是在工作：

var type = d3.scaleOrdinal()
        .domain(['WeWork', 'Regus'])
        .range(['red', 'blue'])
        .unknown("grey");
        
        
var data =  ['WeWork', 'Regus', 'Spaces', 'Knotel', 'RocketSpace', 'HQ Global Workspaces'];

var svg = d3.select("body")
  .append("svg");
  
svg.selectAll("rect")
 .data(data)
 .enter()
 .append("rect")
 .attr("x", function(d,i) { return i * 40 + 50; })
 .attr("y", 40)
 .attr("width", 30)
 .attr("height", 30)
 .attr("fill", type);

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.0.0/d3.min.js"></script>

使用d3.js比例序数

1 个答案:

ordinal.unknown（[value]）<>