0

我知道 d3.scale.ordinal 函数需要精确的 x 到 x 映射，即

var color = d3.scale.ordinal()
    .domain(["apple", "durian", "lemon"])
    .range(["red","green","yellow"]);

我的问题是我需要为我还不知道的水果提供颜色（它在我会读的数据库中，但它经常变化）例如“chiku”、“lychee”等（等等。水果不是事先知道）。

我想将这些未在 var color 中定义的水果分配为“棕色”。

问题：1.以上可以做到吗？2. regexp可以在域中使用吗？例如柠檬。*（用于捕获柠檬X、柠檬Y等）。

谢谢

4

1 回答 1

0

一种可能的解决方案是创建一个Object将水果映射到颜色的方法，例如

var fruit2color = {apple: "red", durian: "green", lemon: "yellow"}

然后，给定一个 列表fruits，您可以使用 . 创建颜色范围map。map遍历数组中的每个水果并返回一个包含每个水果颜色的数组。颜色是您放入的颜色fruit2color，或者如果水果没有指定颜色，则只是'brown'。

var fruits = ["lychee", "chiku", "durian", "plantain", "guava", "apple"];
var colors = fruits.map(function(f){
      return f in fruit2color ? fruit2color[f] : "brown"
    });
var color = d3.scale.ordinal()
    .domain(["apple", "durian", "lemon"])
    .range(colors);

这段代码会给你一个颜色范围

colors = [ 'brown', 'brown', 'green', 'brown', 'brown', 'red' ]

至于问题的第二部分，您可以使用fruit2color带有正则表达式的函数（而不是对象）来分配颜色，例如

var patt = /lemon./;
function fruit2color(f){
    if (patt.test(f)) return "yellow";
    else if (f == "apple") return "red";
    else if (f == "durian") return "green";
    else return "brown";
}
var colors = fruits.map(fruit2color);

然后将生成的颜色传递array给range().

于 2013-10-07T23:44:55.233 回答