javascript - D3 按名称而不是值对层次结构条进行排序

Question

我正在构建一个基于 D3 分层栏示例的演示工具: https://github.com/devsar/d3talk/blob/master/hierarchical-bar.html

添加选项以按名称而非值对层次结构进行排序的最佳方法是什么？

Answer 1

默认情况下，分区布局按其关联的数值排序，但您可以通过调用 sort 设置自己的比较器，该比较器需要一个具有两个参数的函数来相互比较。

要按名称对栏进行排序，只需更改这些行

https://github.com/devsar/d3talk/blob/master/hierarchical-bar.html#L48-L49

对此

var hierarchy = d3.layout.partition()
  .value(function(d) { return d.size; })
  .sort(function(a, b){
      return a.name.toLowerCase() > b.name.toLowerCase();
  });

如果要颠倒排序顺序，返回相反的即可

  return a.name.toLowerCase() < b.name.toLowerCase();

---

编辑:

似乎在扩展查询 栏时，某些名称没有正确排序。更改比较器的返回值会在我这边修复它 (Chrome)

return a.name.toUpperCase().localeCompare(b.name.toUpperCase());