基于另一个对象的值按特定顺序对对象数组进行排序，以实现D3可视化

Question

我有一个包含颜色的对象数组。我需要按颜色以特定顺序对数组进行排序。

我使用answer from stackoverflow对数组进行了特定排序，并且大多数情况下都有效。我现在面临的问题是，当我使用D3J对其进行可视化时，不是将所有具有匹配颜色的对象聚在一起，而是按照指定的顺序重复了颜色。为什么会发生这种情况，如何获得正确的排序。

    var sortOrder = {"#F39849": 0, "#E94927": 1, "#538296": 2, "#CCCCCC": 3};

    var sortedData = data.sort(function (p1, p2) {
      return sortOrder[p1.colors] - sortOrder[p2.colors];
    });

完整代码为here

Answer 1

我猜测这与您数据中不具有colors属性的值有关。我至少有几个。

如果您要处理未知值，请说

    var sortOrder = {"#F39849": 0, "#E94927": 1, "#538296": 2, "#CCCCCC": 3, "unknown" : 100};

和

    return sortOrder[p1.colors || 'unknown'] - sortOrder[p2.colors || 'unknown'];

可能会起作用。

您可能还想处理发现colors但不在列表中的情况，这可能可以通过

处理。

return ((sortOrder[p1.colors || 'unknown'] + 1) || Infinity) - 
       ((sortOrder[p2.colors || 'unknown'] + 1) || Infinity);

Infinity将所有未找到的内容移到列表的末尾，我们需要+1来避免执行0 || Infinity。