如何格式化或自定义 dc.js dataTable 的部分标签

Question

当对部分使用 dc.dataTable 时，“部分”方法接收到 return 用作部分键的值的回调。此值用于将数据分组到部分中，如果启用显示部分 headers，则将用作每个部分的 table.

的标签

我的问题是，如何自定义该标签，使其与 section 方法内部使用的值不同？

我的问题是我使用日期作为节键，需要将其格式化为特定的语言环境 (month-day-year)，但这会导致节的排序不正确（按字母顺序排序）。如果我传递一个像 YYYYMMDD 这样的数字，部分的排序是可以的，但是标签的格式不正确。

在使用节键打印每个节的标签之前，有什么方法可以格式化节键吗？

注意：sortBy 似乎对部分的排序没有影响。

Answer 1

这里的观察很好！

没有 built-in 格式化部分 headers 的方法。
没有独立的方法来对部分进行排序 - 它使用与数据相同的 .order() function。是的......假设 headers 部分甚至与 sortBy 为行检索的字段具有相同的类型是很奇怪的。

根据观察 2，我认为您需要提供按字典顺序排序的组键是正确的。

但是您可以使用 pretransition 挂钩在图表呈现之后和显示之前更改标签：

const parseGroupKey = d3.timeParse('%Y/%m')
const sectionFormat = d3.timeFormat('%B %Y');

nasdaqTable.on('pretransition', table => {
  table.selectAll('tr.dc-table-section td')
    .html(d => {
      const date = parseGroupKey(d.key);
      return sectionFormat(date);
    })
});

这个钩子，用stock例子测试过data/code，

选择所有部分 header 个单元格
读取绑定到它们的数据，格式为{key,value}
解析密钥，这是之前由.section()访问器
用不同的时间格式化程序格式化它

Example fiddle.

最好能修复您确定的两个限制。欢迎投稿！

如何格式化或自定义 dc.js dataTable 的部分标签

how to format or customize the section label of dc.js dataTable

dc.js